前端開發工具包 WijmoJS 2019V1正式發佈:全新的在線 Demo 系統,助您快速上手,開發無憂


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

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

在列舉前端開發工具包WijmoJS 2019V1的所有功能以前,請下載最新安裝程序,以便同步體驗!瀏覽器

>>前端開發工具包WijmoJS 2019V1 下載地址服務器

前端開發工具包WijmoJS 2019V1的主要新特性有:框架

  1. 全新的在線Demo系統
  2. 表格控件 FlexGrid 的新增功能
  3. 數據分析OLAP 的新增功能
  4. 圖表控件FlexChart 的新增功能
  5. 其餘功能:NPM 包的改動、全新的瀏覽器API

更加易用的在線Demo系統:包含示例源碼、參考文檔和API

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

WijmoJS 但願用戶經過全新的在線Demo系統,輕鬆查詢須要使用的功能示例。您也可直接經過搜索功能,查看該示例不一樣框架下的源碼,並對代碼進行在線編輯。佈局

》》當即體驗性能

表格控件 FlexGrid 的新增功能

錯誤提示(errorTip)

表格控件 FlexGrid 中新增錯誤提示(errorTip),用於在驗證錯誤時顯示提示信息。同時,用戶還能夠針對此功能進行自定義擴展,或將其設置爲空(null)。開發工具

該功能的效果以下圖:.net

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

與 Excel 高度相似的數據選擇器

FlexGrid中添加了一個名爲anchorCursor的選項,其主要功能是提供與 Excel 高度相似的數據選擇器。>>查看該功能的JSFiddle示例

與 Excel 高度相似的數據選擇器

重構並簡化了FlexGrid的CSS規則

WijmoJS 重構並簡化了FlexGrid的CSS規則,這樣用戶自定義單元格背景就變得愈來愈簡單。此前,WijmoJS的單元格CSS選擇器不能用單個類選擇器重寫。但在本次重構以後,您能夠自定義一個類,以便更容易地設置單元格背景和文本的樣式。>>查看該功能的JSFiddle 示例

重構並簡化了FlexGrid的CSS規則

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

WijmoJS 進一步提升了FlexGrid的滾動性能,並擴展了單元格從新排序邏輯,以便在水平滾動和凍結單元格網格上工做。這是一個不起眼的變化,但對於那些DOM操做更耗時費力的舊瀏覽器來講,卻意味着高效和低耗。固然,它也使FlexGrid在現代瀏覽器中更快!

數據分析 OLAP 的新增功能

大綱視圖

WijmoJS 在OLAP中添加了一個新的PivotGrid.OutlineMode屬性:在大綱視圖下,PivotGrid以更緊湊的方式呈現行字段。對於具備大量行字段的視圖,該功能將十分受用。它相似於Excel在其數據透視表中提供的功能。>>查看在線 Demo 示例

大綱視圖

圖表控件 FlexChart 的新增功能

新增用戶自定義支持:工具提示、數據點外觀

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

  1. series.tooltipcontent 屬性,容許自定義特定系列的工具提示
  2. series.itemFormatter屬性,容許自定義特定系列中數據點的外觀

此前,工具提示和數據點外觀直接做用於圖表中的全部系列。現在,這些新的改進將爲具備多個系列的圖表添加了更多的靈活性和自定義設置。>>查看在線Demo示例

FlexChart 中新增區域面積圖表

WijmoJS 新版本包含了幾個全新的圖表:如區域面積圖。該圖表用於強調數量隨時間變化的程度,可用於引發人們對總值趨勢的注意。

使用方法:經過將圖表類型設置爲「區域」,而後在序列綁定中設置最小值和最大值,就可使用此圖表類型。>>查看在線 Demo 示例

區域面積圖表

FlexPie 多餅圖

WijmoJS 容許經過使用同一數據源建立多個餅圖「系列」,便可以使用FlexPie在單個圖表中可視化更多數據。

使用方法:要建立多個餅圖系列,請在FlexPie.binding中指定幾個逗號分隔的屬性。>>查看在線 Demo 示例

FlexPies

其餘功能:NPM 包的改動、全新的瀏覽器 API

NPM 包的改動

WijmoJS NPM包已移動到 @grapecity 做用域。這帶來了明顯的好處,如多個模塊格式,可大大簡化在本身的NPM服務器上託管WijmoJS使用。

之前,WijmoJS NPM模塊存儲在單個「Wijmo」NPM包中。如今,每一個模塊都表示爲@grapecity做用域中的一個單獨的包,如@grapecity/wijmo.input或@grapecity/wijmo.grid。

將應用程序切換爲使用新的做用域包須要在應用程序代碼中進行一些修改,即更新「import」語句中的WijmoJS模塊名。

爲了幫助用戶順利過渡,葡萄城技術團隊將在必定時間內繼續維護非做用域的「wijmo」包。所以,最新的WijmoJS版本將以做用域包和非做用域包的形式提供。但您應該儘快進行應用程序的更新,以便使用@grapecity範圍內的新包。

若是您想安裝全部文件(相似於WijmoJS包),能夠選擇 @grapecity/wijmo.all 包。

全新的瀏覽器API 組件 - ResizedObserver

在這個版本中,WijmoJS 使用一個名爲ResizedObserver的新瀏覽器API來改進全部控件的佈局呈現方式。此API容許用戶知曉什麼時候該調整控件元素的大小或更改其可見性,以確保 Web 系統的佈局樣式是否適應它們的容器。

以上就是前端開發工具包 WijmoJS 2019V1的所有內容。如需瞭解更多,請訪問 WijmoJS 產品官網或加入前端技術QQ交流羣:720389894

相關文章
相關標籤/搜索