javascript - D3.js水平直方图

Question

我正在尝试设计一个水平直方图，但我只遇到了 vertical histogram chart作者:迈克·博斯托克。如前所述here ，稍微有点hacky的解决方案是对包含直方图的元素进行变换旋转。要么不使用 d3.layout.histogram() 并手动写出代码。 D3 有没有办法做一些类似的事情

d3.layout.histogram().orient("left")

Answer 1

您可以在渲染时简单地处理它，无需任何转换或重新计算。只需将 d.x 视为 y 位置，将 d.dy 视为宽度而不是高度。

x 和 y 之间的交换可能看起来不合适，但这是完全合理的。甚至还有以这种方式绘制的径向图表的示例，使用 x 值导出条形的 Angular ，使用 y 值导出距中心的距离。这就是 d3 布局的巧妙之处；它们不会让您使用表示法或坐标系——它们只是计算关系。