2013-08-06 6 views
0

nvd3.js를 사용하여 그래프를 구현하고 있습니다. dateArr 두 개의 데이터 하나가 23-07-2013에 1가 185271의 데이터 당으로 [{"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"}]}];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; 
}); 

다른 하나는 24-07-를에 2 : 내 코드와 같은 것입니다 2013. 그러나 첨부 된 이미지를 보면 x 축에 날짜가 표시되는 데 문제가 있습니다. 심지어 24-07-2013 x 축에 존재하지 않습니다. 심지어 첫 데이트가 반복되는 것을 볼 수 있습니다. 문제가있는 부분과 수정 한 부분을 알려주십시오. enter image description here

미리 감사드립니다.

+0

[JSFiddle] (http://jsfiddle.net/)에 코드를 올려보세요. – shabeer90

+0

jsfiddle 코드를 업데이트해도 jsfiddle에서 실행할 수 없습니다. http : // jsfiddle. net/srimanta/saXV5/8/ – Mausumi

답변

0

귀하의 X 타임 스탬프는, 정수는 NaN를위한 따라서 이유는 도구 설명에 표시되어있을 따옴표를 제거해야하는 문자열입니다.

+0

위대한. 고마워. – Mausumi

+0

다른 문제가 발생합니다. 데이터가 매우 적다면 x 축 (날짜)은 여러 개의 동일한 날짜로 다이빙합니다. 예 : 나는 2 개의 날짜가 23-07-2013이고 24-07-2013이고 그 다음에는 x 축에 4 개의 23-07-2013 열이 있습니다. x 축에 23-07-2013 한 개만 있으면됩니다. 가능한가? – Mausumi

+0

전달중인 데이터를 다시 살펴보고 날짜를 반복하지 않는지 확인하십시오. – shabeer90

관련 문제