及时显示NVD3 y轴标签

Question

我需要在应用程序中绘制NVD3条形图，因为我必须按如下所示及时显示X轴格式，请参考下面的代码并帮助我。这就是格式。

00：00、02：00、04：00、06：00、08：00、10：00、12：00

这是我的代码

nv.addGraph(function() {
        chart = nv.models.multiBarHorizontalChart()
            .x(function(d) {
                var stringleght = (d.label).length > 10 ? (d.label).substring(0, 9) + '...' : d.label
                return (stringleght);
            })
            .y(function(d) {
                return d.value[0].x ? d.value[0].x : 0
            })
            .margin({
                top: 20,
                right: 20,
                bottom: 55,
                left: 113
            })
            .tooltip(function(key, x, y, e) {
                t.set('lengendLabel', key);
                t.set('clickSet', y);
                return '<h3>' + key + ' ' + e.point.label + '</h3>' + '<p>' + y + '</p><p>Duration</p>' +
                    '<p style="border-top: 1px solid #cfcfcf">' + e.point.value[0].y + ' Events </p>';
            })
            .transitionDuration(10)
            .showControls(false)
            .forceY([0,100]);
        chart.options(chartOptions)

        chart.yAxis.scale().domain([0, 21600]);

        chart.yAxis
             .tickFormat(function (d) {
                var durationConversion = moment.duration(parseInt(d),'seconds')
                ,   hoursformate = (durationConversion.get('hours') < 10) ? "0" + durationConversion.get('hours') : durationConversion.get('hours')
                ,   minutesformate = (durationConversion.get('minutes') < 10) ? "0" + durationConversion.get('minutes') : durationConversion.get('minutes') 
                ,   secondsformate = (durationConversion.get('seconds') < 10) ? "0" + durationConversion.get('seconds') : durationConversion.get('seconds') 
                ,   formatDur = hoursformate + ':' + minutesformate + ':' + secondsformate;
                return formatDur;
            })
            .axisLabel('Duration');

        d3.select('#loadchart svg')n
            .datum(data)
            .call(chart)

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

Answer 1

您可以设置d3.time.format（formatspecifier）来设置x轴上的时间。 由于您需要HH：MM格式的时间，因此可以使用'％X'作为格式说明符。 所以你的代码看起来像这样

chart.xAxis.tickFormat(function (d) {
                return d3.time.format('%X')(new Date(d));
            });

％X-时间，以“％H：％M：％S”表示。