使用 D3 制作没有胡须的彩色箱线图

Question

我是 D3 的新手，我希望使用类似于 Glassdoor 使用的图表来显示不同服务的价格范围（最低价格、中间价格、最高价格）（请参阅此示例：http://bit.ly/1koKeLL）。

这是一个水平条形图，在左右两侧具有可变边距，以便以图形方式显示低、中值和高数据点。有谁知道实现这一点的最佳方法，尤其是对于刚学习 D3 的人？

Answer 1

我认为这个人很好地实现了一个比你的图表更复杂的图表：

Bullet Chart in D3

但是，如果您想了解 D3，并以一种智能且高效的方式使用它，我的强烈建议是：

不要走捷径。

这意味着在您开始实施任何东西之前，您至少要阅读一个很好的教程，并至少简要了解一下 D3 文档。

一个很好的教程是here。完成全部 20 节课。在您的本地计算机上实施 ALL 示例。你可以在几天内完成。只有这样你才能回到你的例子。

不要被您可以在网上找到的故事所诱惑，例如“我昨天开始使用 D3，现在我创建了最疯狂的可视化”。它们要么是谎言，要么是极度的无知。