使用 Dimple 创建简单的散点图

Question

使用 dimple.js，我正在尝试创建一个简单的散点图。但是，我得到的唯一结果是条形图，我不确定如何将其切换为散点图。我的数据是这样的；

var data = [
    {"Month":new Date(1942, 8, 1, 1, 1, 1, 1), "Workers":0},
    {"Month":new Date(1942, 9, 1, 1, 1, 1, 1), "Workers":667}
    ...
]

然后我像这样创建图表

var svg = dimple.newSvg("body", 800, 600);
var chart = new dimple.chart(svg, data);
var x = chart.addCategoryAxis("x", "Month");
    x.addOrderRule("Date");
chart.addMeasureAxis("y", "Workers");
chart.addSeries(null, dimple.plot.bar);
chart.draw();

我尝试将 x 更改为 chart.addMeasureAxis("x", "Month")，但图表甚至无法呈现。有什么解决办法吗？

Answer 1

要渲染散点图，您需要更改：

chart.addSeries(null, dimple.plot.bar);

到

chart.addSeries(null, dimple.plot.bubble);

不同的轴允许您在不同类型的散点图之间切换。使用 x 上的类别轴，您将获得等间距的点，这些点可能看起来更适合作为折线图（只需将上面的内容更改为 dimple.plot.line）。两个测量轴将形成更标准的散点图，在这种情况下，您可能希望将维度传递给 addSeries 的第一个参数，否则所有数据将聚合到一个点。您可以在 examples on the website.

中查看所有基本类型的散点图以及如何创建它们

使用 Dimple 创建简单的散点图

Create simple scatter plot with Dimple

javascript

data-visualization

d3.js

dimple.js