javascript - d3.js - d3.select ("#id).remove() or .attr("类”， "hidden")不工作

Question

我试图在我的 JavaScript 中删除甚至设置 d3 svg 元素的类，但它似乎没有得到应用。

d3 元素是组的一部分，如果我将 id 设置为单个单词，例如“区域”它将根据我的需要删除/修改，但仅限于整个组。

当我追加元素时，我会为所有元素分配其特定名称的 id。

但是，正如标题所示，d3.select 不允许我修改现有元素。

这是 Chrome 元素 View 中的结构图像。

如何构建路径以及如何操作它们的示例代码。

// Construction
features.selectAll()
            .data(json.features)
            .enter()
            .append("path")
            .attr("class", function (e) {
                return "region " + e.properties.Name + " feature";
            })
            .attr("d", path)
            .attr("id", function(e) {
                return "region " + e.properties.Name + " feature";
            })
            .on("click", function (d) {
                qualifyType(d);
            });

// Manipulation
d3.select("#region South East feature").attr("class", "hidden");
d3.select("#region " + feature.properties.Name + " feature").remove();

我也尝试过其他一些变体，例如 d3.selectAll 等等，但没有什么乐趣。

Answer 1

D3 使用 CSS 选择器来选择元素，并且在这些类名称中必须以点为前缀。因此，选择具有 ID region 和类 South East feature 的元素将如下所示:

d3.select("#region.South.East.feature")