CODEWITHSUNDEEP
lightningchart
Force
Force

Reputation: 3358

JS Line Chart - Null values \ Missing Data Points

I saw that in the .NET version of LightningChart that there is a way to add breaks in line charts. Is this possible in the JS version as well? I saw someone ask a similar question a couple years ago, but hoping that this has been implemented since then.

I've looked through the documentation and examples and didn't couldn't find anything. I'm hoping to replicate something that looks like this in ApexCharts: https://apexcharts.com/javascript-chart-demos/line-charts/null-values/

Upvotes: 2

Views: 1147

Answers (1)

Niilo Keinänen
Niilo Keinänen

Reputation: 2572

Line breaks in LineSeries can be specified by using NaN.

At this time there is no official mention of supporting this, but this is just about to be changed with the next version release. Afterwards, please check the data input method documentation of each series type whether this is supported or not because it might be that not all features support it.

Here is a snippet with the same data as in your referenced ApexCharts example.

const {
  lightningChart
} = lcjs

const chart = lightningChart().ChartXY()
const data = [
  [5, 5, 10, 8, 7, 5, 4, NaN, NaN, NaN, 10, 10, 7, 8, 6, 9],
  [10, 15, NaN, 12, NaN, 10, 12, 15, NaN, NaN, 12, NaN, 14, NaN, NaN, NaN],
  [NaN, NaN, NaN, NaN, 3, 4, 1, 3, 4, 6, 7, 9, 5, NaN, NaN, NaN]
]
data.forEach(yValues => chart.addPointLineSeries().addArrayY(yValues))
<script src="http://unpkg.com/@arction/[email protected]/dist/lcjs.iife.js"></script>

Upvotes: 1

Related Questions