D3：在SVG中选择<g>在Safari中不起作用

Question

我想：

1. 加载外部SVG
2. 选择该SVG中的组以执行某些操作

这是一段代码：

d3.xml("/img/Cell.svg").mimeType("image/svg+xml")
  .get(function (error, documentFragment) {

    if (error) throw error;

    var svgNode = documentFragment.getElementsByTagName("svg")[0];
    document.body.appendChild(svgNode);

    d3.select("g#ID_of_G"); // returns an empty selection in Safari, works in Chrome and Firefox
   ...
});

我还尝试将选择更改为d3.select("svg").select("g#ID_of_G")，但这并未改变任何内容。

Answer 1

哇，好的，我发现了问题：

如果g元素的ID中包含大写字母，则Safari会出现问题。所以我不得不将g元素的ID从 ID_of_G 更改为 id_of_g 并使用以下选项进行选择：

my @type_consent = @{$params->{type_consent}};

此错误报告帮助我找到解决方案：https://bugs.webkit.org/show_bug.cgi?id=83438