2013-08-26 61 views
1

我使用highstock/highcharts,並根據最後5分鐘繪製堆積(和分組)列。Highcharts當前日期不可能有plotband

我想突出顯示最後一刻(並且已經使用了一個情節帶)。

我的問題是,plotband不會覆蓋整個時間範圍內,你可以在http://jsfiddle.net/duuuE/1/

看到我想要的覆蓋plotband是最後一分鐘(直至當前的時間戳),但使用堆疊/分組的列使其變得很奇怪,因爲列沒有繪製在對應於時間戳的相應x軸刻度上。

代碼是這樣的:

$(function() { 
Highcharts.setOptions({ 
    global: { 
     useUTC: false 
    } 
}); 
var now = new Date().getTime(); 
var last10min = now - (10 * 60 * 1000); 
var lastMin = now - (60 * 1000); 
$('#container').highcharts({ 
    chart: { 
     type: 'column' 
    }, 
    xAxis: { 
     type: 'datetime', 
     minTickInterval: 60 * 1000, 
     tickMarkPlacement: 'on', 
     plotBands: [{ // highlight last minute 
      color: '#FCFFC5', 
      from: lastMin, 
      to: now 
     }], 
    }, 

    plotOptions: { 
     series: { 
      pointStart: last10min, 
      pointInterval: 60 * 1000 // one minute 
     }, 
     column: { 
      stacking: 'normal', 
      pointPlacement: 'between' 
     } 
    }, 

    series: [{ 
     data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1] 
    }, { 
     data: [144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4, 29.9, 71.5] 
    }] 
}); 
}); 

回答

1

我認爲你需要從選項中刪除pointPlacement,請參閱:http://jsfiddle.net/Fusher/duuuE/2/

報道問題bug tracker

可能的解決方法:http://jsfiddle.net/duuuE/7/

+0

嗯...去除pointPlacement實際上有助於儘可能的x軸的端部突出,但在這種情況下(使用列),該列是關斷適當的時間幀..因爲它的位置不對應於x軸的值。 –

+0

我認爲它確實如此 - 當你花費實際時間時,它也有秒和毫秒。將其設置爲0,您將有適當的位置列,請參閱:http://jsfiddle.net/Fusher/duuuE/3/ –

+0

實際上......沒有解決問題:有10個值顯示(1對於每分鐘範圍),將顯示10張票(最後10分鐘內每分鐘1張),並且我想突出顯示最後一刻):您將在小提琴中看到您列出了情節帶和最後一列值不要重疊,儘管它們對應於相同的時間範圍。 –