LightningChartJs point series disappears after changing angular route

115 views Asked by At

I'm using LightningChartJs 2.0.2 in my Angular application.

In the chart I have a line and a point series implemented, what works like expected.

But if I change the route and come back to the chart the point series is not visible anymore. Tried with different environments without success. I'm also not able to locate the reason of the actual issue.

Following code shows the creation of the chart and series:

this.chart = lightningChart().ChartXY({container: `${this.chartId}`});

const lineSeries = this.chart.addLineSeries().setStrokeStyle((style) => style.setThickness(5));
   
lineSeries.add(this.points);

const pointSeries = this.chart.addPointSeries().setName('Points').setPointSize(6);

pointSeries.add(this.points);

On destroy the chart is disposed:

ngOnDestroy() {
    // "dispose" should be called when the component is unmounted to free all the resources used by the chart
    this.chart.dispose();
  }

Normally the chart and all depenendencies will be destroyd at this point. If I come back to the chart page the chart should be new created with all it's series, but the point series isn't.

Why the point series is not visible anymore and how to fix it?

Please see the stackblitz example! The chart handling is located in

/src/app/lc-test/lc-test.component.ts

Steps to reproduce the issue:

  1. Change the route to LC Test. You see the line and point series.
  2. Change back to Dashboard and again to LC-Test. The line series is visible and the point series not.

Used Chrome and Firefox on Mac.

lightningChart Js - stackblitz - point series disappears on route change issue

After playing a bit with the zoom options it looks like there is a rendering issue on the point series:

Normal behavior:

enter image description here

After route change and zoom into top section:

enter image description here

1

There are 1 answers

0
Snekw On BEST ANSWER

This was caused by a rendering issue in LightningChart JS v2.0.2. We have now fixed it in a v2.0.3 release. Thank you for bringing this issue to our attention.

With LightningChart JS v2.0.3 the app you provided is working as expected.