如何从 D3 中的矩形获取数据？答案

【问题标题】：How do I get data from a rectangle in D3?如何从 D3 中的矩形获取数据？
【发布时间】：2015-07-30 16:01:32
【问题描述】：

我有一个我目前正在做的事情的模型：

基本上我已经创建了 3 个矩形，顶部有 3 个圆圈，在我自己的工作中大约有 80 个。我想要做的是比较这些矩形以检查哪些矩形具有相同的数字。

我已经在强制布局中使用过节点，所以通常我会像这样遍历它们：

     rectangles.forEach(function(e){

        console.log(e.Number) // to get that rectangles number

        var compareRect = rectangles.filter(function(n){ return n.Number === e.Number});

        if(e.Connect === compareRect.Connect){
        //colour corresponding circles green
        }
        else{
        //colour corresponding circles red
        }
        });

我什至无法登录到控制台，因为这给了我不确定性。

我想获取矩形数据，以便我可以先比较它们的数字，然后一旦数字相同，检查“连接”值是否相同。如果是，则将两个相同编号的矩形上的圆圈涂成绿色，如果“连接”值不同，则将圆圈涂成红色。

希望这是有道理的，基本上我无法获取我创建的任何矩形的数据。谢谢你的时间:)

【问题讨论】：

标签： javascript jquery html css d3.js

【解决方案1】：

请注意，您的变量rectangles 是一个d3 selection，它是一个二维数组，其中包含对您的rects 的分组引用。但是，您正在使用 Array.prototype.forEach() 来遍历数组。

rectangles.forEach(function(e){
    console.log(e.Number) // to get that rectangles number
});

虽然在技术和语法上是正确的，但这不会给你预期的行为。要遍历您的矩形，您应该改用selection.each(function)：

rectangles.each(function(e){
    console.log(e.Number) // to get that rectangles number
});

看到这个工作JSFiddle。

【讨论】：