nvd3防止y轴上的重复值

Question

我的图表重复了y轴上的值。有没有办法我只能有1,2,3但之间没有任何东西（例如我的问题显示在y轴上的下图中）：

使用的代码是这样的：

nv.addGraph(function() {
    var chart = nv.models.multiBarChart();

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

    chart.yAxis
        .tickFormat(d3.format(',.1f'));

    d3.select('#errorsFiredByDate')
        .datum([{values: output, key: "Count by date"}])
        .transition()
        .duration(500)
        .call(chart);

        nv.utils.windowResize(chart.update);

    return chart;
});

Answer 1

您可以通过几个选项来控制D3轴中的刻度线。您可以使用.ticks()明确指定刻度数，但这更像是可以忽略的布局提示。如果您想完全确定滴答，请使用.tickValues()明确设置滴答值。

在你的情况下，这看起来像这样。

chart.yAxis.tickValues(d3.range(chart.yAxis.scale().domain()[0], chart.yAxis.scale().domain()[1]);

根据您的具体应用，其他确定范围的方法可能更合适。

Answer 2

迟到的回复，但可能对其他人有用。我使用一种解决方法来消除重复的刻度，通过维护一组已经应用的刻度和＆amp; d3的多格式说明符。

uniqueTicks = [];
xTickFormat = d3.time.format.multi([
                                    ["%Y", function (d) {
                                        if (uniqueTicks.indexOf(d.getFullYear()) === -1) {
                                            uniqueTicks.push(d.getFullYear());
                                            return true;
                                        } else {
                                            return false;
                                        }                                        
                                    }],
                                    ["", function () {
                                        return true;
                                    }]
                                ]);

d3.svg.axis().tickFormat(xTickFormat );

这个技巧可以针对任何其他类型的刻度格式进行调整。

Answer 3

我遇到了同样的问题，我在图表选项中进行了修复

    yAxis: {
      tickFormat: function(d){
        if ( (d * 10) % 10 === 0 ) {
          return d3.format('.0f')(d);
        }
        else {
          return '';
        }
      }
    }