Question

我在浏览器上使用d3绘制的项目。我想根据他们的财产强调一些。例如，我有杂货，肥皂，肥皂元素的类型为[for_bath (OR) for_cloth_wash]。我想在所有肥皂和杂货中选择特定于for_bath的特定元素，并将它们组合在同一屏幕上。

怎么样？

另外，我的另一个疑问是document.getElementById（）在d3的选择代码中不起作用。我是真的还是疏忽？

修改

var data = {"soaps":{"lux":"bath", "cinthol":"bath", "rin","cloth_washing"}, 
            "shoes":{"valentine":"teens", "bootie":"kids", "kuuch":"kids"}};

//  Now I want to show all bath soaps highlighted, may be with a circle around them.
var svg = d3.select("svg")
            .selectAll(".items")
            .data(data).enter()
            .append("circle")
            //  highlighting styles
;

在这里，我想选择浴皂并将它们弄圆。

Answer 1

你没有给我们任何代码，所以我猜这里。您可能正在寻找的是CSS attribute selectors。因此，如果您要选择将soap属性设置为for_bath的元素，您可以

d3.selectAll("[soap=for_bath]");

这仅适用于DOM元素。如果您正在谈论数据元素，那么您可以使用.filter() method：

data.filter(function(d) { return d.soap == "for_bath"; });

关于你的第二个问题，我不确定你的意思。 d3.select()或d3.selectAll()的参数是DOM选择器，因此document.getElementById()在这里没有意义。但是你当然可以使用其他功能：

d3.selectAll("something").each(function() {
  d3.select(this); // the current element
  document.getElementById("something"); // another element
});

如何使用特定属性值选择d3中的元素

1 个答案: