LightningChart JS是Web上性能最高的圖表庫具有出色的執行性能 - 使用高資料速率同時監控數十個資料源。 GPU加速和WebGL渲染確定您的裝置的圖形處理器得到有效利用,進而實作高重新整理率和流暢的動畫。非常适合用于貿易,工程,航空航天,醫藥和其他領域的應用。
點選下載下傳LightningChart JS最新試用版
相關推薦:
JavaScript可視化圖表庫LightningChart JS最新版安裝教程
JavaScript可視化圖表庫LightningChart JS入門第一步
LightningChartJS 遷移指南
從1.3.1及以前的版本到2.0.0及以後的版本。
LineSet改進
雖然這不是一個破壞相容性的變化,但我們認為這值得在此強調。
我們改進了庫中粗線條的繪制,減少了約75%的記憶體使用,同時改善了線條的視覺效果。
軸的變化
在這個版本中,我們重構了我們的坐标軸tick政策的工作方式,以允許更複雜的坐标軸和更好的視覺風格。是以,tick政策的使用方式也發生了變化。
-
增加了Axis.setTickStrategy( TickStrategy, (optional)tickStrategyMutator )。
o 這用于設定 Axis 的 Tick Strategies,以及 Tick Strategies 的樣式元素。
o 突變器是可選的,僅在樣式化或修改TickStrategy元素時使用。
-
DateTime TickStrategy原點現在可以通過setter方法設定。
o 使用一個突變器來改變DateTime Tick政策的DateOrigin。
o Axis.setTickStrategy( AxisTickStrategies.DateTime, ( tickStrategy ) => {
tickStrategy.setDateOrigin( dateOrigin ) }。)
軸刻度現在被分成三種不同的類别:
-
主要事項
o 這些總是顯示出來。
o 它們代表了所示比例尺中的主要門檻值。
- 小刻度
o 預設顯示,可隐藏
o 在主要刻度之間比對
o 如果标簽可以容納而不與其他标簽重疊,則顯示标簽。
-
否則隻顯示部分或不顯示。
勾線和網格線的顯示不受影響
- 大ticks
o 與DateTime Tick政策一起使用。
o 顯示的是大的門檻值(如日期中的年數)。
o 可以隐藏
- 極端ticks
o 預設情況下是隐藏的,可以啟用。
o 顯示在軸線的兩端。
o 有助于始終顯示一個軸的目前極端值。
不同的tick可以通過使用Axis.setTickStrategy()方法,通過使用可選的tickStrategyMutator來實作風格化。
- Axis.setTickStrategy( TickStrategy, ( mutator ) => { mutator.setMajorTickStyle( (tickStyle) => { tickStyle.setGridStrokeStyle( … ) }。) } )
AxisTickStrategies.NumericWithUnits(數字機關)
NumericWithUnits TickStrategy已被删除。通過使用Numeric TickStrategy及其setFormattingFunction()方法可以實作同樣的功能。
從圖表/軸的建立中删除了預設的軸刻度線政策
舊的行為:
- 在建立圖表時
LightningChart.ChartXY( { defaultAxisXTickStrategy.DateTime() }。AxisTickStrategies.DateTime() }。)
-
在建立Axis時。
ChartXY.addAxisX( undefined, AxisTickStrategies.DateTime())
新行為。
-
在建立圖表時
LightningChart.ChartXY().setTickStrategy( AxisTickStrategies.DateTime )
- 在建立Axis時。
ChartXY.addAxisX().setTickStrategy( AxisTickStrategies.DateTime )
WebGL擴充要求
LightningChart JS現在需要以下WebGL擴充才能正常工作。
- ANGLE_instanced_arrays
- EXT_blend_minmax
- OES_element_index_uint.
- OES_standard_derivatives
- OES_vertex_array_object(頂點陣列對象)
- WEBGL_lose_context
這些擴充在所有現代的桌面和移動浏覽器中都已實作。如果這些擴充中的任何一個缺失,那麼将顯示一個可忽略的警告,以通知使用者可能不正确的工作功能。
你已經知道我們這樣做的原因了–PointSet的性能得到了顯著提升。
儀表闆選項
簡化了Dashboard的建立。圖表選項不再作為一個單獨的選項對象分開。
columnSpan
和
rowSpan
現在是可選的選項,如果沒有定義值,則預設為1。
-
Previously:Dashboard.createChartXY( { columnIndex: 0, rowIndex: 0,
columnSpan: 1, rowSpan:1, chartXYOptions: { theme.Themes.dark, …:
Themes.dark, … } } )
-
Now:Dashboard.createChartXY( { columnIndex: 0, rowIndex.0,
columnSpan: 1, rowSpan: 1,theme: theme: 0, columnSpan: 1, rowSpan:
1,theme: Themes.dark, … } )
ColumnSpan和RowSpan現在是可選的,如果沒有給定值,将預設為1。
requestAnimationFrame和cancelAnimationFrame的Polyfills
1.3.1版本及之前,我們已經為這些功能添加了自己的polyfills。從2.0.0版本開始,開發者需要為這些功能添加自己的polyfills。可以使用一個庫,如 requestAnimationFrame polyfill 庫來實作這個功能。這是為了遵循庫中多邊填充的最佳實踐而改變的。
ColorHEX的變化
我們改變了ColorHEX方法中的值的順序(以前是#ARGB, #AARRGGBB),以對應CSS形式的#RGBA / #RRGGBBAA。