NVD3图的自动日期标注

Question

我希望在更改焦距范围时自动计算，显示和消失日期标签，使它们不重叠。

我正在使用带有焦点图表的MultiBar图表，其中nv.models.multiBar()的默认序数比例。当我在xAxis上使用.ticks(availableWidth / 100 )时，它似乎会为每个日期生成一个刻度标签，或者至少有很多日期：

在nv.models.lineWithFocusChart()上，标签会自动缩小以适应空间。这可能是因为它使用nv.models.scatter()的比例d3.scale.linear()，但我不确定。我尝试使用以下内容创建自己的比例：

x = d3.scale.ordinal() //as well as x = d3.scale.linear()
      .domain(d3.extent(data.map(function(d) {
                return d.values.map(function(d,i) {
                    var X = getX(d,i);
                    return X.getTime();
                });
            })))
         .range([0, availableWidth]);

我按顺序获得以下内容：

并且没有线性刻度的标签。这种方法会起作用吗？如果是这样，我做错了什么？

在nv.models.multiBarChart()上，有一个.reduceXTicks(BOOLEAN)选项，但这仅适用于multiBarChart，似乎没有一种简单的方法可以将其添加到nv.models.multiBar()。我可以以某种方式使用它吗？

如果有什么我没试过请告诉我。我不想自己计算标签，并使用.tickValues（）

指定它们

Answer 1

事实上，解决方案是将d3.scale.linear()用于x轴。我上面尝试的东西没有用，因为当我需要指定当前选择的最小值和最大值时，我指定了上下文图表的整个域。

在chart(selection) {...}中，我放了

x = d3.scale.linear() 
     .range([0, availableWidth]);

并在onBrush()中，我放了x.domain([new Date(extent[0]), new Date(extent[1])]);，其中范围包含选择的最小和最大日期（以毫秒为单位）。