HighStock不gapsize相同的方式工作(HighStock doesn't wor

2019-10-28 20:21发布

我有一个每分钟采集一些数据。 但也有它不规则的间隙。 我使用stockchart(v6.0.5)与“行”图表类型,我的x轴是“日期时间”。 我想的是,差距不切X轴在片而是反映已经在过去的时间http://jsfiddle.net/VwkHu/177/ 。 我真的不希望填补空值在我的数据集的差距可能很大。 我怎样才能得到与stockchart这种行为?

顺便说一句:如果我在上面提到的小提琴股票图表加入StockChart变化如下

...
$('#container').highcharts('StockChart',{
...

然后间隙不反映在数据的实际间隙的大小,但是恒定或等于gapsize。

Answer 1:

使用highstock,需要设置ordinal: false以保持失踪时间在图表中。

在一个序数轴,这些点在图中等距地间隔不论它们之间的实际时间或x的距离。 这意味着,失踪晚上或周末的数据不会占用空间,在图表中。

像这样:

xAxis: {
  ordinal: false,
  ...
},

 $(function() { $('#container').highcharts('StockChart',{ chart: { type: 'line' }, title: { text: 'Snow depth at Vikjafjellet, Norway' }, subtitle: { text: 'Irregular time data in Highcharts JS' }, xAxis: { type: 'datetime', dateTimeLabelFormats: { // don't display the dummy year month: '%e. %b', year: '%b' }, title: { text: 'Date' }, ordinal: false }, yAxis: { title: { text: 'Snow depth (m)' }, min: 0 }, tooltip: { headerFormat: '<b>{series.name}</b><br>', pointFormat: '{point.x:%e. %b}: {point.y:.2f} m' }, series: [{ name: 'Winter 2007-2008', gapSize: 5, //connectNulls: true, // Define the data points. All series have a dummy year // of 1970/71 in order to be compared on the same x axis. Note // that in JavaScript, months start at 0 for January, 1 for February etc. data: [ [Date.UTC(1970, 9, 27), 0], [Date.UTC(1970, 10, 10), 0.6], [Date.UTC(1970, 10, 18), 0.7], [Date.UTC(1970, 11, 2), 0.8], [Date.UTC(1970, 11, 9), 0.6], [Date.UTC(1970, 11, 16), 0.6], [Date.UTC(1970, 11, 28), 0.67], [Date.UTC(1971, 0, 1), 0.81], [Date.UTC(1971, 0, 8), 0.78], [Date.UTC(1971, 0, 10), 0.98], [Date.UTC(1971, 0, 27), 1.84], [Date.UTC(1971, 1, 10), 1.80], [Date.UTC(1971, 1, 18), 1.80], [Date.UTC(1971, 1, 24), 1.92], [Date.UTC(1971, 2, 4), 2.49], [Date.UTC(1971, 2, 11), 2.79], [Date.UTC(1971, 2, 15), 2.73], [Date.UTC(1971, 2, 25), 2.61], [Date.UTC(1971, 3, 2), 2.76], [Date.UTC(1971, 3, 6), 2.82], [Date.UTC(1971, 3, 13), 2.8], [Date.UTC(1971, 4, 3), 2.1], [Date.UTC(1971, 4, 26), 1.1], [Date.UTC(1971, 11, 9), 0.25], [Date.UTC(1971, 11, 12), 0] ] }] }); }); 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="http://code.highcharts.com/stock/highstock.js"></script> <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div> 

工作的jsfiddle例如: http://jsfiddle.net/ewolden/VwkHu/183/



文章来源: HighStock doesn't work with gapsize the same way