根据D3中的当前值更改html属性

我觉得我正在尝试做一些相当简单的事情，但我似乎无法弄清楚。我有一个页面显示几个条形图，我试图建立一个按钮，使某些酒吧出现和消失。酒吧有标签，当按钮被切换时，我希望酒吧的一半消失，其余酒吧的大小加倍和酒吧的标签向下移动一点点。根据D3中的当前值更改html属性

我使用D3.js绘制图形，除了这些小标签外，我几乎可以使用所有工作。我所要做的就是将它们的“y”属性增加大约15个像素，但我似乎无法找到在更改它之前请求此值的方法！

起初我还以为

d3.selectAll(".bar-value-label").attr("y", function(d,i){ return d + 15;})

应该工作。但是，当我记录了这个“d”时，它变成了对最初用于创建此元素的数据对象的引用。

所以，基本上我只是想找到一种方法来获取当前值并将其减小或减小。在D3中有没有一种很好的方法？

问候，莱纳斯

编辑：好了，我已经找到一个可行的办法。我很doubtfull，这是最好的/最有效的方法，所以答案仍然非常欢迎的。

  var resp_labels = d3.selectAll(".bar-value-label-resp")[0]; 
      resp_labels.forEach(function(d,i){ 
       var old_y = parseFloat(d.getAttribute("y")); 
       d3.select(d).transition().attr("y", function(i){ return old_y - barheight/4 ;}); 
      });

来源

2014-06-24 Linus

我还没有机会来检查它的工作原理，但我认为这是您的解决方案的一个稍微简化的版本：

var resp_label = d3.select(".bar-value-label-resp"); 
var old_y = +resp_label.attr("y"); 
resp_label.transition().attr("y", old_y - barheight/4);

来源

2014-06-24 16:12:37

根据D3中的当前值更改html属性

回答

相关问题