x軸缺少日期

我正在使用nvd3.js實現圖形。我的代碼是這樣的：x軸缺少日期

nv.addGraph(function() { 
    charts = nv.models.lineChart(); 
    var chart = charts.margin({ 
     top: 100, 
     right: 20, 
     bottom: 50, 
     left: 45 
    }).showLegend(true).tooltipContent(function (key, y, e, graph) { 
     return '<h3>' + key + '</h3>' + '<p>' + e + '% at ' + y + '</p>' 
    }); 
    chart.xAxis.tickFormat(function (d) { 
     return d3.time.format('%x')(new Date(d)) 
    }); 
    chart.yAxis 
    .tickFormat(d3.format(',d')); 

    chart.forceY([0,20]); 

    d3.select('#lineChart svg') 
    .datum(dateArr) 
    .transition(500).duration(500) 
    .call(chart); 

    nv.utils.windowResize(chart.update); 
    return chart; 
});

哪裏dateArr是[{"key":"182398","values":[{"x":"1375295400000","y":"2"},{"x":"1374517800000","y":"2"},{"x":"1374604200000","y":"12"},{"x":"1374431400000", "y":"1"},{"x":"1375122600000","y":"4"},{"x":"1375209000000","y":"19"}]},{"key":"185271","values":[{"x":"1375295400000","y":"0"},{ "x":"1374517800000","y":"1"},{"x":"1374604200000","y":"2"},{"x":"1374431400000","y":"0"},{"x":"1375122600000","y":"0"},{"x":"1375209000000","y":"0"}]}];

按照數據，對於185271有兩種數據的一個是1上23-07-2013，另一個是2上24-07- 2013。但是，如果您看到附加的圖像，則在x軸中顯示的日期存在問題。即使24-07-2013不在x軸上。即使你可以看到第一次約會的重複。請讓我知道問題出在哪裏以及我修改了什麼。 enter image description here

在此先感謝。

來源

2013-08-06 Mausumi

把你的代碼放在[JSFiddle]（http://jsfiddle.net/）上，這樣我們可以看看 – shabeer90

我不能在jsfiddle中運行，雖然我更新了jsfiddle中的代碼 http：// jsfiddle。 net/srimanta/saXV5/8/ – Mausumi

您的X TimeStamp是一個字符串，它必須是一個Integer，因此在工具提示中顯示NaN的原因是刪除了雙引號。

來源

2013-08-06 10:08:37 shabeer90

很好。非常感謝。 – Mausumi

我遇到了另一個問題，如果數據非常少，則x軸（日期）與多個相同日期一起潛水。例如我只有2日期2013年7月23日和24-07-2013，然後我有4個23-07-2013列x軸。我只需要一個在X軸23-07-2013。可能嗎？ – Mausumi

再次查看你傳遞的數據，確保你沒有重複任何日期。 – shabeer90

回答

相關問題