无法选择< linearGradient>在Chrome中使用D3.js

问题描述

Chrome不会使用D3.js选择< linearGradient> 。在下面的代码中，所有选择都为空。

Chrome doesn't select <linearGradient> with D3.js. In the following code all selections are empty.

var defs = d3.select("body").append("svg").append("defs");
defs.append("linearGradient");
defs.append("linearGradient");
console.log(defs.selectAll("linearGradient")); // empty
console.log(defs.selectAll("lineargradient")); // empty
console.log(d3.selectAll("linearGradient")); // empty

如果替换< linearGradient>

If you replace <linearGradient> with say <mask> it's all right.

var defs = d3.select("body").append("svg").append("defs");
defs.append("mask");
defs.append("mask");
console.log(defs.selectAll("mask")); // 2 elements selected

Firefox适用于两者。我使用的是Chrome 28.0.1500.95。

Firefox works fine for both. I'm using Chrome 28.0.1500.95. Please suggest a way to select the gradients.

推荐答案

这是webkit中的错误 - 请参阅。简单的答案是，它只是坏了。您可以通过明确引用您需要修改的渐变来解决此问题，例如

This is a bug in webkit -- see the bug report. The short answer is that for it's just broken. You may be able to work around this by keeping explicit references to the gradients you need to modify, e.g.

var grad1 = defs.append("linearGradient");

这篇关于无法选择< linearGradient>在Chrome中使用D3.js的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！