前端開發(fā)工具包WijmoJS在2019年的第一個主要版本2019V1已經(jīng)發(fā)布，本次發(fā)布包括了更加易用的在線Demo系統(tǒng)、各控件新增功能、NPM 包的改動，以及全新的瀏覽器API組件。

WijmoJS前端開發(fā)工具包由多款靈活高效、零依賴、輕量級的純前端控件組成，如表格控件 FlexGrid、圖表控件 FlexChart、數(shù)據(jù)分析 OLAP 等，完美支持原生 JavaScript，以及 Angular、React、Vue、TypeScript、Knockout 和 Ionic 等框架，可用于企業(yè)快速構(gòu)建桌面、移動 Web 應用程序。

在列舉前端開發(fā)工具包WijmoJS 2019V1的全部功能之前，請下載最新安裝程序，以便同步體驗!

前端開發(fā)工具包WijmoJS 2019V1的主要新特性有：

1. 全新的在線Demo系統(tǒng)

2. 表格控件 FlexGrid 的新增功能

3. 數(shù)據(jù)分析OLAP 的新增功能

4. 圖表控件FlexChart 的新增功能

5. 其他功能：NPM 包的改動、全新的瀏覽器API

更加易用的在線Demo系統(tǒng)：包含示例源碼、參考文檔和API

WijmoJS在線 Demo 系統(tǒng)中包含了超過 500 種示例源碼、200 份文檔和統(tǒng)一易讀的產(chǎn)品 API 參考，且每一份源碼均使用原生 JavaScript(基于 ES6 模塊)、Angular(V2+)、Vue(V2+)、React 來實現(xiàn)，助您快速上手，開發(fā)無憂。

WijmoJS希望用戶通過全新的在線Demo系統(tǒng)，輕松查詢需要使用的功能示例。您也可直接通過搜索功能，查看該示例不同框架下的源碼，并對代碼進行在線編輯。

表格控件 FlexGrid 的新增功能

錯誤提示(errorTip)

表格控件 FlexGrid 中新增錯誤提示(errorTip)，用于在驗證錯誤時顯示提示信息。同時，用戶還可以針對此功能進行自定義擴展，或?qū)⑵湓O置為空(null)。

該功能的效果如下圖：

使用單元格的“title”屬性時顯示驗證錯誤提示

與 Excel 高度類似的數(shù)據(jù)選擇器

FlexGrid中添加了一個名為anchorCursor的選項，其主要功能是提供與 Excel 高度類似的數(shù)據(jù)選擇器。>>查看該功能的JSFiddle示例

與 Excel 高度類似的數(shù)據(jù)選擇器

重構(gòu)并簡化了FlexGrid的CSS規(guī)則

WijmoJS重構(gòu)并簡化了FlexGrid的CSS規(guī)則，這樣用戶自定義單元格背景就變得越來越簡單。此前，WijmoJS的單元格CSS選擇器不能用單個類選擇器重寫。但在本次重構(gòu)之后，您可以自定義一個類，以便更容易地設置單元格背景和文本的樣式。>>查看該功能的JSFiddle 示例

重構(gòu)并簡化了FlexGrid的CSS規(guī)則

進一步提升了 FlexGrid 的滾動性能

WijmoJS進一步提高了FlexGrid的滾動性能，并擴展了單元格重新排序邏輯，以便在水平滾動和凍結(jié)單元格網(wǎng)格上工作。這是一個不起眼的變化，但對于那些DOM操作更耗時費力的舊瀏覽器來說，卻意味著高效和低耗。當然，它也使FlexGrid在現(xiàn)代瀏覽器中更快!

數(shù)據(jù)分析 OLAP 的新增功能

大綱視圖

WijmoJS在OLAP中添加了一個新的PivotGrid.OutlineMode屬性：在大綱視圖下，PivotGrid以更緊湊的方式呈現(xiàn)行字段。對于具有大量行字段的視圖，該功能將十分受用。它類似于Excel在其數(shù)據(jù)透視表中提供的功能。>>查看在線 Demo 示例

大綱視圖

圖表控件 FlexChart 的新增功能

新增用戶自定義支持：工具提示、數(shù)據(jù)點外觀

FlexChart添加了兩個新功能，使用戶自定義變得更加容易：

1. series.tooltipcontent 屬性，允許自定義特定系列的工具提示

2. series.itemFormatter屬性，允許自定義特定系列中數(shù)據(jù)點的外觀

此前，工具提示和數(shù)據(jù)點外觀直接作用于圖表中的所有系列。如今，這些新的改進將為具有多個系列的圖表添加了更多的靈活性和自定義設置。>>查看在線Demo示例

FlexChart 中新增區(qū)域面積圖表

WijmoJS新版本包含了幾個全新的圖表：如區(qū)域面積圖。該圖表用于強調(diào)數(shù)量隨時間變化的程度，可用于引起人們對總值趨勢的注意。

使用方法：通過將圖表類型設置為“區(qū)域”，然后在序列綁定中設置最小值和最大值，就可以使用此圖表類型。>>查看在線 Demo 示例

區(qū)域面積圖表

FlexPie 多餅圖

WijmoJS允許通過使用同一數(shù)據(jù)源創(chuàng)建多個餅圖“系列”，即可以使用FlexPie在單個圖表中可視化更多數(shù)據(jù)。

使用方法：要創(chuàng)建多個餅圖系列，請在FlexPie.binding中指定幾個逗號分隔的屬性。>>查看在線 Demo 示例

FlexPies

其他功能：NPM 包的改動、全新的瀏覽器 API

NPM 包的改動

WijmoJS NPM包已移動到 @grapecity 作用域。這帶來了明顯的好處，如多個模塊格式，可大大簡化在自己的NPM服務器上托管WijmoJS使用。

以前，WijmoJS NPM模塊存儲在單個“Wijmo”NPM包中?，F(xiàn)在，每個模塊都表示為@grapecity作用域中的一個單獨的包，如@grapecity/wijmo.input或@grapecity/wijmo.grid。

將應用程序切換為使用新的作用域包需要在應用程序代碼中進行一些修改，即更新“import”語句中的WijmoJS模塊名。

為了幫助用戶順利過渡，葡萄城技術(shù)團隊將在一定時間內(nèi)繼續(xù)維護非作用域的“wijmo”包。因此，最新的WijmoJS版本將以作用域包和非作用域包的形式提供。但您應該盡快進行應用程序的更新，以便使用@grapecity范圍內(nèi)的新包。

全新的瀏覽器API 組件 - ResizedObserver

在這個版本中，WijmoJS 使用一個名為ResizedObserver的新瀏覽器API來改進所有控件的布局呈現(xiàn)方式。此API允許用戶知曉何時該調(diào)整控件元素的大小或更改其可見性，以確保 Web 系統(tǒng)的布局樣式是否適應它們的容器。

以上就是前端開發(fā)工具包 WijmoJS 2019V1的全部內(nèi)容。

關(guān)于葡萄城

賦能開發(fā)者!葡萄城集團成立于 1980 年，是全球領(lǐng)先的集開發(fā)工具、商業(yè)智能解決方案、管理系統(tǒng)設計工具于一身的軟件和服務提供商。西安葡萄城是其在中國的分支機構(gòu)，面向全球市場提供軟件研發(fā)服務，并為中國企業(yè)的信息化提供國際先進的開發(fā)工具、軟件和研發(fā)咨詢服務。葡萄城的控件和軟件產(chǎn)品在國內(nèi)外屢獲殊榮，在全球被數(shù)十萬家企業(yè)、學校和政府機構(gòu)廣泛應用。

生成海報

免責聲明：本網(wǎng)站內(nèi)容主要來自原創(chuàng)、合作伙伴供稿和第三方自媒體作者投稿，凡在本網(wǎng)站出現(xiàn)的信息，均僅供參考。本網(wǎng)站將盡力確保所提供信息的準確性及可靠性，但不保證有關(guān)資料的準確性及可靠性，讀者在使用前請進一步核實，并對任何自主決定的行為負責。本網(wǎng)站對有關(guān)資料所引致的錯誤、不確或遺漏，概不負任何法律責任。任何單位或個人認為本網(wǎng)站中的網(wǎng)頁或鏈接內(nèi)容可能涉嫌侵犯其知識產(chǎn)權(quán)或存在不實內(nèi)容時，應及時向本網(wǎng)站提出書面權(quán)利通知或不實情況說明，并提供身份證明、權(quán)屬證明及詳細侵權(quán)或不實情況證明。本網(wǎng)站在收到上述法律文件后，將會依法盡快聯(lián)系相關(guān)文章源頭核實，溝通刪除相關(guān)內(nèi)容或斷開相關(guān)鏈接。