Skip to main content
Version: 6.1.2

Append JSON

Before, the main method for adding and specifying data sets was the add method, which looked like this:

const data = [
{ "x": 0, "y": 10 },
{ "x": 1, "y": 12 },
...
]
SeriesXY.add(data)

With the XY features rework, the add method is still supported, but deprecated. Instead, it is recommended to use appendJSON method. This does the exact same, but is more configurable and significantly more performant in many situations.

const data = [
{ "x": 0, "y": 10 },
{ "x": 1, "y": 12 },
...
]
PointLineAreaSeries.appendJSON(data)

By default, appendJSON takes an Array of JavaScript objects and reads the x and y properties from each. However, let's say your data doesn't have x and y properties but something more specific. With appendJSON you can tell directly what property name should be used:

const data = [
{ "timestamp_utc": 0, "voltage_s1": 10 },
{ "timestamp_utc": 1, "voltage_s1": 12 },
...
]
PointLineAreaSeries.appendJSON(data, { x: 'timestamp_utc', y: 'voltage_s1' })

This is nothing groundbreaking itself, but a massive improvement to before. Previously, you would have had to first map your data into a duplicated Array with the right property names:

const dataXY = data.map(sample => ({ x: sample.timestamp_utc, y: sample.voltage_s1 }))
SeriesXY.add(dataXY)

This is heavy, and extremely wasteful. Doing this for large data sets (100k+) takes a really long time and gives Garbage Collector a lot of extra work to do.