宝塔服务器面板,一键全能部署及管理,送你10850元礼包,点我领取

WijmoJS是葡萄城推出的前端开发套件,是以80多种HTML5为基础,支持跨平台的高性能UI组件(表组件、图表组件、数据分析组件、导航它与本机JavaScript完全兼容,支持Angular、React和Vue等前端框架,并在企业级网站上使用

最近,wijmojs v 2021.0更新正式发布。 在这次更新中,添加了与Angular、React和Vue都兼容的视觉地图组件,以及用于绑定REST API的数据管理组件RestCollectionView。

前端开发工具包wijmojs v 2021.0更新1的新功能列表:

加入同时兼容Angular、React和Vue的可视化地图组件

WijmoJS在这次更新中,添加了用于地理数据可视化展示的地图组件FlexMap。 该组件使地理数据生动,易于分析。 目前,FlexMap组件还处于测试阶段,之后将继续优化和添加一些贴图包(区域贴图文件)。

FlexMap组件功能支持色度渲染和向地图添加尺寸点,如散点图和气泡图。 零部件使用地理要素- JSON绑定地理要素图层和点图层。 建议使用NaturalEarthData作为地理空间数据源,并根据需要自定义地图形状。

以下是使用FlexMap组件的部分场景。

在JavaScript、Angular、React和Vue中创建层次统计映射

使用FlexMap,可以在几行代码中轻松创建层次统计图。 分级地图用于显示地理区域的统计值,各区域根据其所代表的数据进行着色。

web前端可视化图表(前端可视化图表)-冯金伟博客园

在JavaScript、Angular、React和Vue中创建散点图

FlexMap支持向地图添加兴趣点和创建散点图。 散点图用于显示地图上特定坐标处的兴趣点。

web前端可视化图表(前端可视化图表)-冯金伟博客园

在JavaScript、Angular、React和Vue中创建气泡图

FlexMap可用于创建气泡图。 气泡图中显示的气泡大小取决于数据值。 大值=大气泡)。

web前端可视化图表(前端可视化图表)-冯金伟博客园

新的图表动态调色板

WijmoJS的第二个新功能是用于在地图和图表上创建漂亮的层次统计地图的图形动态调色板。

web前端可视化图表(前端可视化图表)-冯金伟博客园

调色板的配色方案参考了专业的配色网站,有以下几种。

顺序(SequentialSingle和SequentialMulti ) :按颜色浓淡从低到高的顺序,按数据从深到淡的顺序显示。 发散:两端表示深色,中端表示浅色,浅色表示中间值,深色表示极低值和极高值。 定性:最适合显示名义和分类数据。 不表示值的差异。 可以使用这些新调色板制作非常漂亮的图表。

web前端可视化图表(前端可视化图表)-冯金伟博客园

用于绑定REST API的RestCollectionView组件

WijmoJS的第三个新功能是RestCollectionView组件,用于绑定REST API。

默认情况下,排序、分页和过滤在服务器上进行,但使用WijmoJS可以在客户端上更改设置,也可以将自定义RestCollectionView绑定到WijmoJS组件

web前端可视化图表(前端可视化图表)-冯金伟博客园

要使用这个组件,只需要创建扩展RestCollectionView并重写以下方法:

getItems :从服务器检索项目列表。 可以对该列表进行排序、筛选和分页。 addItem :向服务器上的集合添加项目。 patchItem :在服务器上编辑集合中的项目。 deleteItem :从服务器上的集合中删除项。

可用于Angular、React和Vue的MultiRow单元格模板

WijmoJS的最后一个新功能是可用于Angular、React和Vue的单元格模板,用于定义MultiRow单元格中的自定义内容。 单元格模板支持绑定语法、嵌套组件、自定义HTML和条件逻辑。

web前端可视化图表(前端可视化图表)-冯金伟博客园

以上是前端开发工具包WijmoJS V2021.0 Update1的更新内容。 有关详细信息,请单击下面的“详细信息”访问WijmoJS产品官网。