Missing null values at line chart

[AitorMihashi]

Description

The scatter dot dissapears when moving the cursor over the chart

Steps to Reproduce

1. Open this URL
2. Go to the chart and move around
3. You will see that the green point at X:4, Y:12 dissapears and move to the point where you leave the chart

Expected Behavior

The green scatter point stays at it´s position even when you move your mouse over the chart.

Actual Behavior

The scatter green point is dragged and dropped at a X point when you go out of the chart

Screenshots

Chart when you load the page

Chart when you move the mouse over

Reproduction Link

https://apexcharts.com/javascript-chart-demos/line-charts/null-values/

[Guziq]

I've also noticed that, for some data points, the dots disappear completely. For example, this works fine:

{
  name: 'Peter',
  data: [null, 2000, null, 2000, null, 2000, null, 2000, null, 2000, null, null, null, 2000, null, null, 40, null],
}

However, when I replace the value 40 with null in the following dataset:

{
  name: 'Peter',
  data: [null, 2000, null, 2000, null, 2000, null, 2000, null, 351, null, null, null, 2000, null, null, null, null],
}

The graph disappears completely.

I found that setting:

stroke: {
    curve: 'monotoneCubic',
},

Fix all the issues.

[AitorMihashi]

@Guziq Can you tell me with apexcharts version are you using?

[ledpup]

This is somewhat related to the issue above. In a chart with null values, there is some weird artefacting going on after the mouse leaves the chart.

If you look at the image below, the three dots I've circled in red shouldn't be there at all.

You can reproduce the issue by having 10 as the last x-axis value you were hovering on and then move the mouse outside of the chart.

[ledpup]

@Guziq Can you tell me with apexcharts version are you using?

They're using the demo page at https://apexcharts.com/javascript-chart-demos/line-charts/null-values/