jQuery Flot跳過x軸值

Question

我通讀了Flot的大部分文檔，但並沒有發現任何相關內容。

目前，我的浮點圖如下所示：

並且由於中間行沒有數據，因此我希望能夠將其隱藏，但仍顯示來自第一個和最后兩個x軸列的數據。

我定義x軸值的方式如下：

var options = [{[1, '1-1-2013'], [2, '1-4-2013'], [3, '1-7-2013'], 
[4, '1-10-2013'], [5, '1-1-2014']}];

效果很好，因為我根據每個元素的第一個數字繪制了數據值，這是某種日期ID。

為了更好地解釋它，我希望圖表看起來像這樣粗糙：

Answer 1

您可以手動更改數據系列以忽略所有空值，但隨后還必須手動指定刻度（和標簽）。

例如，如果您的數據類似於

data = [
    ['1-1-2013', 2.5],
    ['1-2-2013', 2.0],
    ['1-3-2013', 0.0],
    ['1-4-2013', 2.2]
];

您的數據將更改為

data = [
    [0, 2.5],
    [1, 2.0],
    [2, 2.2]
];

而您的x軸刻度將是

ticks = [
    [0, '1-1-2013'],
    [1, '1-2-2013'],
    [2, '1-4-2013']
];

可能的代碼：

var newdata = [];
var newticks = [];

function changeData(data) {
    $.each(data, function(index, element) {
        if (element[1] != 0.0) {
            newdata.push([ newdata.length, element[1] ]);
            newticks.push([ newticks.length, element[0] ]);
        }
    });
}

Answer 2

您可以使用tick for-matter函數如果value為零，則返回null，否則在指定tick數組時，將空字符串傳遞給相應的值。

var ticks = [
          [1, '1-1-2013'], 
          [2, '1-4-2013'],
          [3, ''], 
          [4, '1-10-2013'], 
          [5, '1-1-2014']
];

要么

xaxis: {
     tickFormatter: function(v, axis) {
        if(v != 0) {
            return "<span class='axisLabel'>" + v + "%</span>";
        } else {
            return "";
        }
}