带画笔滑块的 d3js 条形图

【问题标题】：d3js bar chart with brush slider带画笔滑块的 d3js 条形图
【发布时间】：2016-07-18 18:08:02
【问题描述】：

通过查看以下示例http://bl.ocks.org/mbostock/4349545，我试图用条形图替换圆圈，表示每天的事件，以获得几年的数据。数据就是格式

 {"15/01/2015: 214","22/03/2016: 30",..}

有人可以指点我正确的方向吗？

谢谢！

【问题讨论】：

标签： javascript d3.js

【解决方案1】：

您可以通过将 data 与新集合交换来获得条形图：

var data = [{ "date" : "15/01/2015", "value" : 214}
        ,{ "date" : "22/03/2016", "value" : 30}]

解析日期，将x轴改为日期时间，然后在这个地方将circle的类型改为Rect（带有新属性等）：

var circle = svg.append("g").selectAll("circle")
.data(data)
.enter().append("circle")
.attr("transform", function(d) { return "translate(" + x(d) + "," + y() + ")"; })
.attr("r", 3.5);

但是，在您带来的示例中brushg 对所有 Rect 类型的元素使用 selectAll，因此它会与新方法发生冲突。

【讨论】：