如何使酒窝散点图不聚合

Question

我正在尝试使用 dimple.js 在 Iris 数据上构建散点图。

这是我的代码：

<div id="chartContainer">
<script src="https://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script src="http://dimplejs.org/dist/dimple.v2.2.0.min.js"></script>
<script type="text/javascript">
var svg = dimple.newSvg("#chartContainer", 590, 400);
  d3.csv("/wp-content/uploads/2016/05/iris.csv", function (data) {
    var myChart = new dimple.chart(svg, data);
    myChart.setBounds(60, 30, 500, 330)
    myChart.addMeasureAxis("x", "sepal_length");
    myChart.addMeasureAxis("y", "sepal_width");
    myChart.addSeries(null, dimple.plot.bubble);
    //myChart.addLegend(200, 10, 360, 20, "right");
    myChart.draw();
  });
</script></div>

结果如下：

我知道 dimple 会根据 myChart.addSeries(null, dimple.plot.bubble); 聚合数据，这就是为什么只有一个气泡出来的原因。但是我想让每条数据记录都有一个气泡，如何取消聚合？

Answer 1

理想情况下，您的数据中会有一个字段来标识气泡代表什么，您可以将其传递到您提到的 addSeries 的第一个参数中。

myChart.addSeries("Observation", dimple.plot.bubble);

如果除了萼片宽度和长度之外，您真的没有任何东西可以区分是什么使您的数据中的元素与另一个元素不同，您可以将它们传入：

myChart.addSeries(["sepal_width", "sepal_length"], dimple.plot.bubble);

数组中的最后一个元素用于着色，因此这将导致所有具有不同萼片长度的气泡被不同地着色。因此，我建议在两个字段之后为系列所代表的内容添加一个标签：

myChart.addSeries(["sepal_width", "sepal_length", "Sepals"], dimple.plot.bubble);

如何使酒窝散点图不聚合

how to make Dimple Scatterplot no aggregate

dimple.js