x轴上的日期在d3.js中跳过第一次行军

时间:2013-06-06 11:13:15

标签: graph d3.js nvd3.js

我正在尝试使用nvd3.js获取lineChart() 我以JSON格式获取数据,这里是JSON数据的图像 enter image description here

现在代表nvd3轴的数据,这里是函数

    function getData(transport) {
    var arr = [];

    for (var i = 0; i < transport.length; i++) {
       arr.push({
            x: Date.parse(new Date(transport[i].timePeriod).addHours(7)),
            y: transport[i].number
        });
   }
    return arr;
}

以下是绘制图表的其余代码。

function customersData(transport) {

    return [
                  {
                      key: "Active Customers",
                      values: getData(transport),
                      color: "#ff7f0e"
                  }
    ];
}

function drawGraphForMonth(transport) {
    var chart;
    chart = nv.models.lineChart()
        .x(function (d) {
            return d.x;
        })
        .y(function (d) {
            return d.y;
        });

    chart.xAxis
        .tickFormat(function(d) { return d3.time.format("%b-%Y")(new Date(d)); });
        //.tickSize(6, 3, 0);

    chart.yAxis
        .tickFormat(d3.format(',g'));

    d3.select('#chart1 svg')
        .datum(customersData(transport))
        .call(chart);

    nv.utils.windowResize(chart.update);
    chart.dispatch.on('stateChange', function (e) { nv.log('New State:', JSON.stringify(e)); });

    return chart;
}

我面临的问题是,它正在跳过月游行。当我正在调试时......我意识到3月1日将是2月28日,而在本月余下时间,它将返回正确的日期。

对此有何帮助?

另一个问题是,如何定义可以在x轴上出现的最小和最大刻度数?

0 个答案:

没有答案