17

我正在使用d3 分类选择,在第一个参数中,我想使用一个返回类名的函数,而不是字符串。

selection.classed(name[, value])

我知道我可以使用这里.attr()提到的方法来做同样的事情,但我希望能够使用分类来做同样的事情。

我怎样才能做到这一点?

4

4 回答 4

33

您在那里提供的类名需要固定,即您不能拥有类似function(d) { return d; }. 如果需要类名由数据决定,则需要使用.attr("class", ...).

如果您担心覆盖现有的类名,请注意您可以按如下方式检索和添加这些名称。

.attr("class", function(d) { return d3.select(this).attr("class") + " " + d; })
于 2013-07-03T15:54:56.947 回答
4

我遇到了一个类似的问题,如果我的基准上的属性为真,我想添加一个类,如果属性为假,我想添加一个不同的类:

selection.classed('class-one', function(d) { return d.property; })
    .classed('class-two', function(d) { return d.property; });

如果您要添加的课程数量很少,那么可能值得考虑这样的事情。

于 2016-01-05T14:37:21.203 回答
4

类似于建议的答案,但我发现

selection.each(function(d) { d3.select(this).classed(d.class, true)

也有效。

于 2017-06-21T02:06:45.913 回答
2

Lars 的回答很好,但是如果您从属性上没有类开始,它会将类“null”添加到元素中,因为 null 属性被强制为字符串。他的下一步自然是:

.attr("class", function(d) {
      var existing = d3.select(this).attr("class") 
      if (existing == null){
        return d.column.class
      }else{
        return existing + " " + d.column.class
      }
})

如果您想要更简洁,可以将其制成带有三元运算符的单线

于 2017-09-04T17:43:12.873 回答