Highcharts - 如何将气泡图直线排列？

Question

我正在使用Highcharts并希望创建一个气泡图表，其中的条目在同样贬值的气泡大小中都是直线。诀窍在于使气泡之间几乎没有任何空间。喜欢这个

除了编写某种算法以将其沿x轴放置在某一点之外，还有一种简单的方法吗？

非常感谢。

Answer 1

没有内置选项，没有。您必须自己计算尺寸/ x轴关系。

另一方面，我觉得有义务指出这是提供数据的可怕方式。 很受欢迎，但很可怕。

不太受欢迎但更好的替代方案是简单的水平条形图，这样可以提高周围的可读性。

讨论原因：

• http://www.perceptualedge.com/example18.php
• http://www.perceptualedge.com/blog/?p=1532

---

<强> {{EDIT ::

我手动设置了一个，只是为了计算thought process：

• http://jsfiddle.net/jlbriggs/D3LqV/

基本理念：

• 设置x轴min和max，使1 x轴单位= 1个绘图宽度像素，以便于计算
• 而不是使用气泡系列类型，使用散点图，并为每个点指定标记半径值（以像素为单位。这是气泡为系列类型之前的'旧'方式）
• 您可以通过确定最大气泡所需的最大像素大小，然后将编码值（$或其他）除以最大值，然后乘以每个值的最大像素大小来计算半径。
• 然后相应地计算你的x值 - 在我的例子中，最大像素半径为50.第一个数据点的x值为50.第二个数据点的x值为100 +它的半径像素值等...... / LI>

如果您查看示例，并确保像素宽度和x轴设置相关，则数学运算非常简单。写一个循环来完成这一切应该只是稍微复杂一点。

{{再次编辑：采取了刺激 粗糙，但工作，或多或少...

• http://jsfiddle.net/jlbriggs/xe82d/

{再一次： 这个会自动考虑图表的宽度：

• http://jsfiddle.net/jlbriggs/yM9jt/