开放原子开发者工作坊

Wijmo UI控件支持Angular 2

 

从Angular的1.x时代开始，Wijmo就已经支持Angular了。最近，我们正在和Angular团队合作来支持Angular 2。有趣的是，对Angualr 2 的支持甚至更容易。我们的源代码用TypeScript编写，我们可以很容易地扩展我们的控件类，来轻松地创建Angular 2组件。

 

 

Wijmo为每一个UI控件都提供了Angular 2 组件。所有Angular 2组件都提供了完全声明性标记。我们已经对有需要的属性提供了双向绑定的支持，我们还对定制绑定和一些组件提供了附加功能，比如对FlexGrid中的单元格模板，可以允许你用标签指明单元格的内容。

 

Wijmo的Angular 2组件被封装为模块并且可以在Angular 2应用中作为NPM包被使用。我们遵循Angular 2团队设置的模式，在Angular2中使用Wijmo组件会感到非常熟悉。

 

HTML 5 OLAP模块

当你有很多数据时，使用普通的项目列表就很难分析数据。数据透视表可以汇总数据并且允许你用不同的方式来帮助你分析数据。使用Excel的数据透视表来做分析就很容易。你选中原始数据，单击“插入数据透视表”，选择一个目标，可以看到一个面板，这里你可以用不同的方法拖放字段来汇总数据并且立即看到结果。这是Excel最强大和受欢迎的功能之一。

 

Wijmo中的OLAP可以让你的HTML 5应用具有类似的功能。在网页中增加一个PivotPanel控件，通过设置数据源属性来给它原始数据，并且连接到PivotGrid控件或者PivotChart控件来查看结果。

 

• PivotPanel

 

Wijmo的PivotPanel跟Excel中的“数据透视表字段列表”非常相似，为最终用户提供了一个熟悉的，快速的体验。

 

1. PivotPanel展示了一个列表，包含数据库中所有字段，允许最终用户很容易的创建数据分析视图。

 

2. 用户可以把字段拖放到面板的四个不同的区域：过滤、列、行、值。

 

3. PivotPanel的智能数据类型识别节省了用户大量的时间。如果选中一个字符类型，它会自动把这个字段放到行区域，但是如果选中数字类型，它会自动把这个字段放到值区域。

 

4. 你可以在Values 区域多次使用同一个字段来展示总数聚合和合计聚合。

 

5. PivotPanel也借助Wijmo全球化模块支持数据过滤和格式化。

 

 

在PivotPanel中增加字段

 

• PivotGrid

PivotGrid允许最终用户创建数据分析视图。简化了大数据集的显示和导航，PivotGrid会绑定到了PivotPanel。PivotGrid支持展开、折叠行并且可以展示聚合数据包括分组行的小计。PivotGrid扩展了FlexGrid并且提供了非常灵活的显示和简易的单元格格式化。

 

在PivotGrid中显示分组和小计

 

•  PivotChart

PivotChart是FlexChart的一个扩展用来优化聚合数据的展示。当它绑定到PivotPanel，它可以按照用户选择的字段可视化地进行分组。

PivotChart

 

Wijmo PDF

Wijmo的PDF模块基于PDFKit库开发，用来生成PDF文档。它被用作将FlexGrid 和FlexChart输出为PDF。Wijmo的PDF模块也支持在单个文档中绘制FlexGrid、FlexChart，同时混有任意PDF基本元素比如文本、图形和图片。

 

 

支持Material Design

 

Material Design Lite(MDL)是谷歌为web开发者实现的Material Design规范。它时尚、漂亮是Bootstrap CSS替代者。我们已经创建了大约300个全新的Wijmo主题支持所有的MDL标准颜色组合。我们创建了一个示例来展示如何使用Wijmo控件满足Material Design。

 

FlexSheet 示例

这次发布中加入了一些复杂的FlexSheet示例。FlexSheetExplorer 样例展示了很多FlexSheet的最佳特征，在一个程序中你可以体验到很多的功能。这个示例的源代码也可以用来展示这些功能的实现。

FlexSheet浏览器

 

马上登陆Wijmo官网，下载体验最新版吧！