NVD3图形的自动日期标签

我希望日期标签能够在更改焦点范围时自动计算，显示和消失，以便它们不重叠。NVD3图形的自动日期标签

我正在使用具有聚焦图表的默认序号比例为nv.models.multiBar()的MultiBar图。当我在x轴使用.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（）指定它们。

来源

2015-10-01 spooky655

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

在chart(selection) {...}，我把

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

和onBrush()，我把x.domain([new Date(extent[0]), new Date(extent[1])]);，其中程度包含分钟，以毫秒为单位的选择的最大日期。

来源

2015-10-02 15:17:08 spooky655

NVD3图形的自动日期标签

回答

相关问题