There is such a schedule:

var data =[[1488443024345,1],[1488443052668,1],[1488443094365,1],[1488443110533,1],[1488446988765,1],[1488447423974,1],[1488513056234,1],[1488513836036,1],[1488513851574,1],[1488514695328,1],[1488514709362,1],[1488515284743,1],[1488515297659,1],[1488524223238,1]]; Highcharts.stockChart('container_danger', { chart: { alignTicks: false }, rangeSelector: { enabled: false }, series: [{ type: 'column', name: 'Тревога', data: data, dataGrouping: { groupPixelWidth: 0 } }, ] });

And it looks like this: enter image description here Please note that the distance between the points is the same, but I want it to be real. How to do it?

  • Can I add sample data? - kb0
  • @ kb0 added an example - Geri4

1 answer 1

Add xAxis: { type: 'datetime', ordinal: false } :

 var data = [ [1488443024345, 1], [1488443052668, 1], [1488443094365, 1], [1488443110533, 1], [1488446988765, 1], [1488447423974, 1], [1488513056234, 1], [1488513836036, 1], [1488513851574, 1], [1488514695328, 1], [1488514709362, 1], [1488515284743, 1], [1488515297659, 1], [1488524223238, 1] ]; Highcharts.stockChart('container', { chart: { alignTicks: false }, rangeSelector: { enabled: false }, xAxis: { type: 'datetime', ordinal: false }, series: [{ type: 'column', name: 'Тревога', data: data, dataGrouping: { groupPixelWidth: 0 } }] }); 
 #container { min-width: 300px; max-width: 800px; height: 300px; margin: 1em auto; } 
 <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highcharts/5.0.6/css/highcharts.css" /> <script src="https://cdnjs.cloudflare.com/ajax/libs/highcharts/5.0.6/js/highstock.js"></script> <div id="container"></div>