Question

我在做什么的描述：我生成了一个散点图。当用户点击群集按钮时，旧的散点图将被删除，新的群集数据将显示出来。绘制散点图的初始数据是坐标数组。在使用dimas-kmeans聚类包（src：https://www.npmjs.com/package/dimas-kmeans）进行聚类之后，聚类数据存储在3个不同的数组中（3个不同的聚类）

问题：我如何遍历这个新的聚类数据（这是3个不同的数组）来绘制散点图，每个聚类代表不同的颜色？

链接到jsfiddle：https://jsfiddle.net/data_x/nk2mhhtc/12/

重要代码:(在jsfiddle的第126行）

       .attr("cx", function (d,i) { //d is each array out of 3 arrays
            console.log(d);
            return  x(d[0]);
        })
        .attr("cy", function (d) {               
            return y(d[1]);
        })
        .style("fill", color)//Different color to each different array out of 3. 3 different color patterns to distinguish 3 different clusters.

赞赏任何提示/帮助，

谢谢，

Answer 1

clustered_data changeplot中的data是一个对象数组，而您的初始getClusters是一个坐标数组......可能@MessageDriven(activationConfig = { @ActivationConfigProperty(propertyName = "destinationType", propertyValue = "javax.jms.Queue"), @ActivationConfigProperty(propertyName = "connectionFactoryJndiName", propertyValue = "jms/notConnectionFactory"), @ActivationConfigProperty(propertyName = "destinationJndiName", propertyValue = "jms/notScannerQueue") }) public class AttachmentMDB implements MessageListener {必须做更多的事情来打包右边数据结构。

Answer 2

不知道为什么我自己在几天内回答了我的所有问题。

Sol：我不需要更改从getclusters（）获得的数据格式，而是需要通过以下方式解析不同的集群并输出颜色：

//Create circles
    var circles1 = svg.selectAll("circle")
                        //.data(cluster_result);
                        .data(clustered_data)
                        .enter()
                        .append('g')
                       .each ( function(d,i) {
                            d3.select(this).selectAll("circle")
                                .data(d.data)
                                .enter()
                                .append("circle")
                                .attr("cx", function(d) { return x(d[0])})
                                .attr("cy", function(d){ return y(d[1])})
                                .attr("r", 3)
                                .style("fill", color(d.data));
                        })

[帮助]：d3.js Scatterplot遍历3个不同的数组

2 个答案: