高庫存-時間軸刻度不連續

Question

我嘗試在高庫存折線圖中繪制一些數據庫數據。 我的數據以json格式加載到圖表中，如下所示：

[[1383042797000,551.11]，[1383042812000,551.11]，[1383042827000,551.11]，[1383042842000,567.78]，[1383042857000,567.78]，[1383042872000,567.78]，[1383042887000,567.78]，[1383042902000,584.44]，[ 1383042917000,601.11]，[1383042932000,601.11]，[1383042947000,617.78]，[1383042962000,634.44]，[1383042977000,634.44]，[1383042992000,634.44]，[1383043007000,634.44]，[1383043022000,634.44]，[1383043037000， 651.11]，[1383043052000,651.11]，[1383043067000,667.78]，[1383043082000,667.78]，[1383043098000,667.78]，[1383043113000,667.78]]；

所以我有一個特定的時間戳（毫秒），每個點都有一個值。

如果時間戳記每15秒計數一次，該圖表將很好地顯示我的數據。 但是作為機器數據，我有幾小時甚至幾天的停頓時間，其中機器已關閉，但這次我沒有數據庫條目...

現在，圖表沒有在圖表中顯示“缺口”，因為沒有數據，這很有意義，但是它忽略了暫停並直接顯示新值...

puh，我希望你能跟隨我...這里有個例子：

在11月8日，機器在14:59關機，下一個值為11。 06:00，但圖表跳過了這兩個日期之間的時間，並將它們彼此相鄰顯示...

我需要該圖來顯示從我的第一個值到最后一個值的整個時間段！ 有人知道該怎么辦嗎？

這是我圖的js代碼：

(function($){ 

$(function() {

    $.getJSON('http://jsonData', function(data) {
        $('#container').highcharts('StockChart', {
            chart: {
            },
             xAxis: {
                    type: 'datetime'
                },

            series : [{
                data : data,
                turboThreshold: 100000

            }]

        });
    });

});

})(jQuery);

在此先感謝您的幫助 ：）！！

干杯J！

Answer 1

我假設您調用從數據庫獲取數據的函數，即每3秒或其他常規時間。 因此，當您無法從數據庫獲取數據時，可以將空點添加到該系列中。

Answer 2

這是我在JSFiddle中的示例：

請遵循以下鏈接http://jsfiddle.net/gh/get/jquery/1.7.2/highslide-software/highcharts.com/tree/master/samples/stock/xaxis/ticks/，然后嘗試以下代碼：

$(function() {
    var data = [
/* 2009-01-01 */
[1230771600000, -5.8, 0.1],
[1230858000000, -4.1, 1.4],
[1230944400000, -0.5, 4.1],
[1231030800000, -8.9, -0.7],
[1231117200000, -9.7, -3.7],
[1231203600000, -3.4, 3.2],
[1231290000000, -3.9, -0.2],
[1231376400000, -2.4, 6.7],
[1231462800000, 3.8, 6.9],
[1231549200000, 3.1, 6.8],
[1231635600000, 0.0, 7.6],
[1231722000000, 5.6, 9.4],
[1231808400000, 3.6, 6.5],
[1231894800000, -3.6, 3.8],
[1231981200000, -6.0, -1.5],
[1232067600000, -3.8, 2.4],
[1232154000000, 1.5, 4.2],
[1232240400000, 0.0, 4.5],
[1232326800000, -1.1, 3.6],
[1232413200000, 0.5, 5.1],
[1232499600000, 0.0, 2.5],
[1232586000000, -0.6, 2.1],
[1232672400000, 0.8, 4.7],
[1232758800000, 0.6, 4.4],
[1232845200000, -3.9, 1.4],
[1232931600000, -4.3, 2.0],
[1233018000000, -6.1, -0.4],
[1233104400000, -0.3, 1.9],
[1233190800000, -2.9, 2.7],
[1233277200000, -4.0, -1.0],
[1233363600000, -4.4, -1.9],
/* 2009-02-01 */
[1233450000000, -5.0, -2.7],
[1233536400000, -5.2, -2.3],
[1233622800000, -6.3, -0.6],
[1233709200000, -5.4, -0.6],
[1233795600000, -2.1, 1.4],
[1233882000000, -4.6, 1.5],
[1233968400000, -5.4, 0.6],
[1234054800000, -8.7, -2.6],
[1234141200000, -5.2, 1.3],
[1234227600000, -8.6, -2.2],
[1234314000000, -8.5, 0.1],
[1234400400000, -4.8, 1.7],
[1234486800000, -8.3, 1.4],
[1234573200000, -8.6, 1.1],
[1234659600000, -3.2, 1.5],
[1234746000000, -0.7, 4.1],
[1234832400000, 0.2, 3.2],
[1234918800000, 0.0, 3.9],
[1235005200000, 1.2, 4.5],
[1235091600000, 1.3, 5.7],
[1235178000000, 1.0, 2.3],
[1235264400000, 1.1, 5.5],
[1235350800000, 1.0, 6.5],
[1235437200000, 0.9, 3.7],
[1235523600000, 1.5, 4.3],
[1235610000000, 0.5, 5.4],
[1235696400000, -4.9, 3.8],
[1235782800000, -5.4, 1.4],
/* 2009-03-01 */
[1235869200000, -1.9, 4.0],
[1235955600000, 0.9, 8.1],
[1236042000000, 1.7, 8.1],
[1236128400000, 0.0, 9.1],
[1236214800000, 2.5, 7.7],
[1236301200000, 2.1, 5.6],
[1236387600000, 1.5, 6.9],
[1236474000000, 0.6, 7.9],
[1236560400000, 1.9, 9.4],
[1236646800000, 1.8, 7.0],
[1236733200000, 0.2, 8.6],
[1236819600000, -0.3, 5.9],
[1236906000000, 1.6, 8.3],
[1236992400000, -0.4, 8.8],
[1237078800000, -2.0, 5.4],
[1237165200000, 2.2, 6.7],
[1237251600000, 0.0, 7.2],
[1237338000000, 0.8, 9.3],
[1237424400000, -1.7, 7.5],
[1237510800000, -2.0, 6.3],
[1237597200000, -0.3, 5.7],
[1237683600000, 1.7, 5.9],
[1237770000000, -0.8, 5.7],
[1237856400000, -3.5, 5.7],
[1237942800000, -2.6, 5.0],
[1238029200000, -0.7, 8.0],
[1238115600000, -2.8, 6.0],
[1238202000000, -2.9, 6.1],
[1238288400000, 0.3, 7.0],
[1238371200000, 0.5, 7.5],
[1238457600000, 1.6, 4.7],
/* 2009-04-01 */
[1238544000000, -1.4, 7.3],
[1238630400000, 2.8, 6.8],
[1238716800000, 3.4, 12.0],
[1238803200000, 0.6, 13.5],
[1238889600000, 5.5, 8.3],
[1238976000000, 3.3, 8.3],
[1239062400000, 0.6, 13.5],
[1239148800000, 3.0, 13.7],
[1239235200000, 6.6, 15.2],
[1239321600000, 5.6, 10.3],
[1239408000000, 5.6, 15.2],
[1239494400000, 4.1, 10.0],
[1239580800000, 0.4, 11.8],
[1239667200000, 0.5, 13.6],
[1239753600000, 3.8, 15.6],
[1239840000000, 6.0, 11.6],
[1239926400000, 3.9, 13.9],
[1240012800000, 0.8, 14.3],
[1240099200000, 2.9, 17.3],
[1240185600000, 7.1, 12.2],
[1240272000000, 2.4, 12.9],
[1240358400000, 4.7, 12.9],
[1240444800000, 2.0, 16.3],
[1240531200000, 9.5, 17.4],
[1240617600000, 3.4, 16.7],
[1240704000000, 6.7, 19.1],
[1240790400000, 4.9, 15.8],
[1240876800000, 8.4, 15.3],
[1240963200000, 4.1, 18.6],
[1241049600000, 6.6, 19.9],
/* 2009-05-01 */
[1241136000000, 8.7, 21.4],
[1241222400000, 9.2, 16.4],
[1241308800000, 6.2, 12.9],
[1241395200000, 0.0, 13.4],
[1241481600000, 4.5, 11.2],
[1241568000000, 3.2, 14.3],
[1241654400000, 3.1, 13.7],
[1241740800000, 6.4, 14.6],
[1241827200000, 5.0, 13.5],
[1241913600000, 4.8, 11.5],
[1242000000000, 3.5, 13.0],
[1242086400000, 4.5, 15.0],
[1242172800000, 2.0, 17.0],
[1242259200000, 4.3, 18.3],
[1242345600000, 4.5, 18.8],
[1242432000000, 8.0, 20.7],
[1242518400000, 7.4, 20.7],
[1242604800000, 8.4, 17.7],
[1242691200000, 8.3, 15.2],
[1242777600000, 8.3, 17.9],
[1242864000000, 6.7, 17.0],
[1242950400000, 7.6, 17.5],
[1243036800000, 6.6, 17.3],
[1243123200000, 8.7, 17.7],
[1243209600000, 8.9, 17.7],
[1243296000000, 8.4, 11.5],
[1243382400000, 5.9, 14.2],
[1243468800000, 5.1, 16.9],
[1243555200000, 8.3, 16.0],
[1243641600000, 6.2, 22.6],
[1243728000000, 7.8, 22.6],
/* 2009-06-01 */
[1243814400000, 7.3, 21.7],
[1243900800000, 8.7, 16.2],
[1243987200000, 7.3, 13.9],
[1244073600000, 3.9, 15.5],
[1244160000000, 6.4, 17.3],
[1244246400000, 2.9, 17.9],
[1244332800000, 3.9, 17.9],
[1244419200000, 6.5, 16.8],
[1244505600000, 8.0, 14.2],
[1244592000000, 7.8, 16.2],
[1244678400000, 8.6, 15.3],
[1244764800000, 8.2, 18.2],
[1244851200000, 9.5, 17.0],
[1244937600000, 5.7, 18.7],
[1245024000000, 7.0, 16.9],
[1245110400000, 4.3, 15.8],
[1245196800000, 3.6, 19.1],
[1245283200000, 10.8, 15.0],
[1245369600000, 8.6, 16.3],
[1245456000000, 10.7, 17.0],
[1245542400000, 9.7, 18.9],
[1245628800000, 9.8, 20.6],
[1245715200000, 12.8, 19.5],
[1245801600000, 8.6, 24.1],
[1245888000000, 10.9, 26.6],
[1245974400000, 13.5, 28.0],
[1246060800000, 12.5, 23.2],
[1246147200000, 14.0, 28.1],
[1246233600000, 14.9, 29.5],
[1246320000000, 16.9, 22.5],
/* 2009-07-01 */
[1246406400000, 14.3, 27.7],
[1246492800000, 14.5, 27.8],
[1246579200000, 15.5, 29.6],
[1246665600000, 16.7, 30.7],
[1246752000000, 16.5, 25.0],
[1246838400000, 17.8, 25.7],
[1246924800000, 13.5, 24.8],
[1247011200000, 10.5, 21.4],
[1247097600000, 9.2, 23.8],
[1247184000000, 11.6, 21.8],
[1247270400000, 10.7, 23.7],
[1247356800000, 11.0, 23.3],
[1247443200000, 11.6, 23.7],
[1247529600000, 11.8, 20.7],
[1247616000000, 12.6, 22.4],
[1247702400000, 13.6, 19.6],
[1247788800000, 11.4, 22.6],
[1247875200000, 13.2, 25.0],
[1247961600000, 14.2, 21.6],
[1248048000000, 13.1, 17.1],
[1248134400000, 12.2, 15.5],
[1248220800000, 12.0, 20.8],
[1248307200000, 12.0, 17.1],
[1248393600000, 12.7, 18.3],
[1248480000000, 12.4, 19.4],
[1248566400000, 12.6, 19.9],
[1248652800000, 11.9, 20.2],
[1248739200000, 11.0, 19.3],
[1248825600000, 10.8, 17.8],
[1248912000000, 11.8, 18.5],
[1248998400000, 10.8, 16.1]
];
    $('#container').highcharts('StockChart', {
            chart: {
            },
             xAxis: {
                    type: 'datetime'
                },

            series : [{
                data : data,
                turboThreshold: 100000,
                pointStart: Date.UTC(2013, 10, 28),
                pointInterval: 60 * 1000,
                tooltip: {
                    valueDecimals: 1,
                    valueSuffix: '°C'
                },
                datagrouping:{
                    enabled: false
                }

            }]

        });
});

（它具有范圍數據，但是在這種情況下沒有關系...）如果每個月的點數相同，則軸看起來很完美！ 如果您現在從pe June中刪除一些點，則該圖將“推到一起”，因此您在x軸上到處都沒有相同的單位。

非常感謝你的幫助！

干杯J！ :)

Answer 3

要使圖形在兩點之間的時間比平時長時“剪切”曲線，可以在繪圖選項中添加gapSize選項。

此示例將在每次x軸上的兩個點之間的距離大於整個系列中x軸上的兩個點之間的較小距離的兩倍時切割曲線。

plotOptions: {
    line: {
        gapSize: 2
    }
}

JsFiddle示例