Javascript 使用点击功能过滤数据

我有两个数组对象，它们包含我的d3.svg.symbol类型，即圆形、正方形和三角形。数组1有多个符号，我在画布上绘制它们，而数组2只包含三个对齐的符号

我的目标是能够点击array 2过滤掉所有我不想看到的array 1符号。e、 g.单击数组2中的一个圆仅表示数组1中显示了圆

      var array1 = svg.selectAll(a.array1)
                   .data(json).enter().append("a")

          array1.transition().duration(1000)
             .attr("transform", function(d,i) {return "translate("+d.x+","+d.y+")" ;})


          array1.append('path')
                .attr("d", d3.svg.symbol().type(function(d) {return shape [d.Country];}).size(120))


      var array2 = svg.selectAll(g.array2)
                     .data(filt)
                     .enter().append("g")
                     .attr("transform", function(d,i) {return "translate("+d.x+","+d.y+")" ;})

          array2.append("path")
          .attr("d", d3.svg.symbol().type(function(d){return d.shape;}).size(200))
          .attr("transform", "translate(-10, -5)")

因此，我的问题是如何指定单击array2的特定类型，因为我有三种类型。因此，我希望所有的都是可点击的，但结果不同

到目前为止，我已经尝试了这个方法，只是为了尝试在array2中选择特定的形状

       array2.on("click", function(){    alert('success')  })

当我单击其中任何一个按钮时，它只会发出警报，但是当应用此选项时：

    array2.on("click", function(){ if (d3.svg.symbol().type('circle') === true) { return  alert('success') ;};  })

当我点击array2的圆圈时，它一点也不警觉

---

如果我能得到一些帮助那就太好了-谢谢

事件侦听器获取当前数据和索引作为参数，请参阅。您还可以通过此访问DOM元素。你可以像下面这样使用它

.on("click", function(d) {
   if(d.shape == "circle") { alert("success"); }
});

---

嗨，Lars Kotthoff，谢谢你的回复。但是，这似乎也不起作用-什么也看不出来。onclick，函数d{if d.shape=='circle'{return alert'success'}。。看起来很好用。但是我怎样才能让它从第一个数据集中过滤出圆圈呢？汉克斯，我已经更新了答案。要获得特定的圆，您需要使用一些其他属性进行过滤。当然，您可以比较实际数据值，但更好的方法是分配CSS类。当您为第一个数据集附加元素时，只需执行.attrclass、data1或类似操作，然后您可以将它们选择为.selectAll.data1。