WijmoJS 是一款前端開發(fā)工具包，由 80 多款基于 HTML5、支持跨平臺(tái)的高性能 UI 組件（如表格組件、圖表組件、數(shù)據(jù)分析組件、導(dǎo)航組件和金融圖表組件等）構(gòu)成，完美兼容原生 JavaScript，支持 Angular、React、Vue 等前端框架，用于企業(yè)級(jí) Web 應(yīng)用程序的快速開發(fā)和構(gòu)建。

近日，WijmoJS V2021.0 Update1正式發(fā)布，本次更新加入了一款同時(shí)兼容Angular、React和Vue的可視化地圖組件，以及用于綁定REST API 的數(shù)據(jù)管理組件RestCollectionView。

在為您列舉 WijmoJS的更新內(nèi)容之前可點(diǎn)擊下方鏈接下載安裝包，以便同步體驗(yàn)。

點(diǎn)擊下載最新版WijmoJS

前端開發(fā)工具包 WijmoJS V2021.0 Update1 新特性一覽：

加入同時(shí)兼容Angular、React和Vue的可視化地圖組件

WijmoJS 在本次更新中，加入了一款用于地理數(shù)據(jù)可視化展示的地圖組件FlexMap，該組件可以使您的地理數(shù)據(jù)栩栩如生，并變得更易于分析。目前， FlexMap組件還處于測(cè)試階段，后續(xù)會(huì)持續(xù)優(yōu)化并添加一些地圖包（區(qū)域地圖文件）。

FlexMap組件功能支持渲染色度和為地圖添加標(biāo)注點(diǎn)，如散點(diǎn)圖和氣泡圖，組件使用GeoJSON綁定地理要素圖層和點(diǎn)圖層（建議將NaturalEarthData用作GeoJSON數(shù)據(jù)的源，并根據(jù)需要自定義MapShaper）。

如下是FlexMap組件的部分使用場(chǎng)景：

1. 在JavaScript、Angular、React和Vue中創(chuàng)建分級(jí)統(tǒng)計(jì)地圖

借助FlexMap，只需幾行代碼就可以輕松創(chuàng)建分級(jí)統(tǒng)計(jì)地圖。分級(jí)統(tǒng)計(jì)地圖用于顯示地理區(qū)域的統(tǒng)計(jì)值，每個(gè)區(qū)域都會(huì)根據(jù)其表示的數(shù)據(jù)進(jìn)行著色。

2. 在JavaScript、Angular、React和Vue中創(chuàng)建散點(diǎn)圖

FlexMap支持為地圖添加興趣點(diǎn)，以及創(chuàng)建散點(diǎn)圖。散點(diǎn)圖用于顯示地圖上特定坐標(biāo)處的興趣點(diǎn)。

3. 在JavaScript、Angular、React和Vue中創(chuàng)建氣泡地圖

FlexMap可用于創(chuàng)建氣泡地圖。氣泡圖在地圖上顯示的氣泡大小取決于數(shù)據(jù)的值（較大的值=較大的氣泡）。

新的圖表動(dòng)態(tài)調(diào)色板

WijmoJS 的第二個(gè)新功能是圖表動(dòng)態(tài)調(diào)色板，用于在地圖和圖表中創(chuàng)建漂亮的分級(jí)統(tǒng)計(jì)地圖。

調(diào)色板的配色方案參考了專業(yè)配色網(wǎng)站，包括以下幾種：

• 順序（SequentialSingle和SequentialMulti） ：按顏色深淺顯示數(shù)據(jù)從低到高的順序，從低值到高值依次以深色到淺色表示。
• 發(fā)散：兩端為深色，中端為淺色，淺色表示中間值，深色代表極低值和極高值。
• 定性：最適合顯示名義或分類數(shù)據(jù)。顏色不表示值的差異。

利用這些新的調(diào)色板可以創(chuàng)建非常美觀的圖表。

用于綁定REST API的RestCollectionView組件

WijmoJS 的第三個(gè)新功能是一款RestCollectionView組件，該組件用于綁定REST API。

在默認(rèn)情況下，排序、分頁和篩選是在服務(wù)器上完成的，但是借助WijmoJS ，便可以在客戶端上更改其中的任何設(shè)置，將自定義的RestCollectionView綁定到WijmoJS組件中，便可自動(dòng)調(diào)用服務(wù)器以執(zhí)行CRUD操作。

要使用這個(gè)組件，您只需創(chuàng)建一個(gè)擴(kuò)展RestCollectionView并重寫以下方法：

• getItems：從服務(wù)器獲取項(xiàng)目列表。該列表可以被排序，過濾和分頁。
• addItem：將一個(gè)項(xiàng)目添加到服務(wù)器上的集合中。
• patchItem：在服務(wù)器上編輯集合中的項(xiàng)目。
• deleteItem：從服務(wù)器上的集合中刪除一個(gè)項(xiàng)目。

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

WijmoJS 的最后一個(gè)新功能是可用于Angular、React和Vue的單元格模板，使用該模板來標(biāo)記定義MultiRow單元格中的自定義內(nèi)容。單元格模板支持綁定語法、嵌套組件、自定義HTML和條件邏輯。

以上就是前端開發(fā)工具包 WijmoJS V2021.0 Update1的更新內(nèi)容，如需了解詳細(xì)信息，歡迎訪。