添加數(shù)據(jù)的方法

---

立即下載LightningChart JS

本指南主要是關(guān)于ChartXY的，其他圖表類型的數(shù)據(jù)輸入方法可能略有不同。

添加

大多數(shù)ChartXY特性都使用XY坐標(biāo)列表，在最簡(jiǎn)單的層次上這些可以定義并推入級(jí)數(shù)，如下所示：

const dataSet = [ 
{ x: 0, y: 10 }, 
{ x: 1, y: 12 }, 
{ x: 2, y: 15 }, 
] 
const lineSeries = chart.addLineSeries({ dataPattern: { pattern: "ProgressiveX" } }) 
.add(dataSet)

但根據(jù)具體情況，不同的數(shù)據(jù)附加方法可能更方便。

addArrayY, addArrayX

這些方法只在一個(gè)軸上推送一個(gè)值列表，導(dǎo)致另一個(gè)維度被自動(dòng)“索引”，例如：

lineSeries.addArrayY([ 0, 10, 5, 8, 6 ]) 
// same as add([ { x: 0, y: 0 }, { x: 1, y: 10 }, { x: 2, y: 5 }, { x: 3, y: 8 }, { x: 4, y: 6 } ])

自動(dòng)索引從最后一個(gè)X坐標(biāo)開(kāi)始，所以這些方法即使在實(shí)時(shí)用例中也可以很容易地使用：

setInterval(() => { 
lineSeries.addArrayY([ Math.random() ]) 
}, 1000)

此外，索引行為可以通過(guò)可選參數(shù)step和start來(lái)控制：

lineSeries.addArrayY([ 0, 10, 5, 8, 6 ], 0.1, 10) 
// same as add([ { x: 10, y: 0 }, { x: 10.1, y: 10 }, { x: 10.2, y: 5 }, { x: 10.3, y: 8 }, { x: 10.4, y: 6 } ])

addArrayX的行為與addArrayY完全相同，只是維度顛倒了(Y被自動(dòng)索引，而不是X)。

addArraysXY

此方法可用于輸入X和Y值，但要從不同的列表中輸入，例如：

lineSeries.addArraysXY([0, 1, 2, 3], [10, 5, 8, 6]) 
// same as add([ { x: 0, y: 10 }, { x: 1, y: 5 }, { x: 2, y: 8 }, { x: 3, y: 6 } ])

如果你的數(shù)據(jù)是二進(jìn)制格式，這是一個(gè)很好的方法：

// timestamps: Float32Array 
// measurements: Float32Array 
lineSeries.addArraysXY(timestamps, measurements)

LightningChart JS使用WebGL可視化數(shù)據(jù)，WebGL限制為32位浮點(diǎn)精度。如果您使用二進(jìn)制格式傳輸數(shù)據(jù)(例如，使用WebSocket)，為了降低帶寬使用，將數(shù)據(jù)精度限制為32位替代完整的64位可能更好。

Clear

最后，可以使用clear()方法清除任何先前推送的數(shù)據(jù)，例如要完全覆蓋顯示的數(shù)據(jù)：

// myDataSet: Array<{ x: number, y: number }> 
lineSeries.clear().add(myDataSet)