d3 on(使用类而不是ID单击操作

时间:2015-05-09 03:16:00

标签: javascript svg d3.js data-visualization

我有一个d3即我正在制作,我仍然坚持点击动作。

我有两个基于a(1或0)的值创建的形状(方形,圆形)。然后我给每个svg一个b值的ID(范围从1到4)和一年中的一个类(2000年到2014年)。很明显,每个svg只有一个b值和年份相关联。

示例数据:

  

A:0 B:3年:2012

     

A:1 B:3年:2008

     

A:1 B:2年:2012

     

答:1 B:4年:2006年

使用最后一行数据创建:

  

svg-circle class ='2006'id ='b4'

圆圈由A = 1左右决定 该课程由年份创建 id由B值

创建

这部分完成了。大!另一件很棒的事情是我能够通过点击图例来过滤ID(由b值决定)。我是按照this example进行的。

    .on("click", function(){
         var active   = b4.active ? false : true,
         newOpacity = active ? 0 : 1;
         d3.select("b4").style("opacity", newOpacity);
         b4.active = active;
    });

这很酷,但我想对我的课程(从年份创建)做同样的事情。我已经走到了这一步:

    .on("click", function(){  
    ...
    ...
    d3.select(function(d) {return "." + d;})
        .style("opacity", newOpac);   

函数d是年份的唯一值。在前面的例子中,它将active设置为等于ID(b4.active),我将如何使用类来执行此操作?可能吗?我还需要做点什么吗?

谢谢!

0 个答案:

没有答案