highcharts end point to endpoint connection

Question

in my chart highcharts connect the start and end point of the graph. I dont want this to happen . how can I solve it. js fiddle link:https://jsfiddle.net/mdng223/h2o57agx/ My question is similar to this but have not got the solution provided herehttps://www.highcharts.com/forum/viewtopic.php?t=43018

Highcharts.setOptions({
  global: {
    useUTC: false
  }
});

Highcharts.chart('container', {
  chart: {
    zoomType: 'x'
  },
  tooltip: {
    xDateFormat: '%d/%m/%Y',
    shared: true,
    split: false,
    enabled: true
  },
  title: {
    text: ''
  },
  xAxis: {
    type: 'datetime',
    crosshair: {
      snap: true
    }
  },
  legend: {
    enabled: true
  },
  series: [{
    data: []
 },]
});

user_8951377 · Answer

You have unsorted data: https://www.highcharts.com/errors/15/

Here: https://jsfiddle.net/BlackLabel/7rzb6e85/ you can find out which elements in the data array are unsorted.

And here is how you can sort your data by x values:

data.sort((a,b) => a[0] - b[0]);

Live demo: https://jsfiddle.net/BlackLabel/w7x6dtLo/

user_15704647 · Answer

it works fine you have to add .sort() at the end of your data array to solve this issue

highcharts end point to endpoint connection

2 Answers