如何在NVD3折线图中的x轴上显示日期?

时间:2017-08-16 11:41:47

标签: javascript jquery python d3.js nvd3.js

我正在尝试将x轴格式化为日期。我相信我没有以正确的格式传递日期数据。我收到一个javascript错误'datetime未定义'。我在这里添加了一个小提琴演示https://jsfiddle.net/hq8uv0sb/8/

nv.addGraph(function () {
            var chart = nv.models.lineChart()
                .useInteractiveGuideline(true); 

            chart.yAxis.axisLabel('Price')
                .tickFormat(d3.format(''));

            chart.xAxis.tickFormat(function(d) {
                 var dx = renderData()[0].values[d] && renderData()[0].values[d][0] || 0;
                return d3.time.format('%x')(new Date(dx))
            });    

            chart.duration(500);

            chart.legend.maxKeyLength(100);

            d3.select('#dateChart')
                .datum(renderData())

                .call(chart);

            nv.utils.windowResize(function () {
                d3.select('#dateChart').call(chart)
            });

            return chart;
        });


function renderData() {
    var myData = {'Number': [datetime.date(2014, 7, 15), datetime.date(2014, 7, 16), datetime.date(2014, 7, 17)], 'Price': [100.0, 96.8645, 95.405]};

    var result = [];
    for (var i = 0; i < myData.Number.length; i++) {
        result.push({
            x: myData.Number[i],
            y: myData.Price[i]
        });
    }

0 个答案:

没有答案