添加数据的方法

---

立即下载LightningChart JS

本指南主要是关于ChartXY的，其他图表类型的数据输入方法可能略有不同。

添加

大多数ChartXY特性都使用XY坐标列表，在最简单的层次上这些可以定义并推入级数，如下所示：

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

但根据具体情况，不同的数据附加方法可能更方便。

addArrayY, addArrayX

这些方法只在一个轴上推送一个值列表，导致另一个维度被自动“索引”，例如：

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 } ])

自动索引从最后一个X坐标开始，所以这些方法即使在实时用例中也可以很容易地使用：

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

此外，索引行为可以通过可选参数step和start来控制：

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被自动索引，而不是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 } ])

如果你的数据是二进制格式，这是一个很好的方法：

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

LightningChart JS使用WebGL可视化数据，WebGL限制为32位浮点精度。如果您使用二进制格式传输数据(例如，使用WebSocket)，为了降低带宽使用，将数据精度限制为32位替代完整的64位可能更好。

Clear

最后，可以使用clear()方法清除任何先前推送的数据，例如要完全覆盖显示的数据：

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