如何在D3.JS

Question

中使用圓圈內的defs元素我在defs標記內的g中有一個形狀（繪製的雲）。不幸的是，我無法在使用d3.js的circle內使用此形狀。這裏是我的代碼： JSFiddle

我想要做的是顯示那個形狀，它是在SVG中顯示的圓內的defs標籤。我以不同的方式嘗試過很多次，但我無法使用circle中defs標籤的形狀。任何人都可以請這個問題協助我嗎？先謝謝你。

Answer 1

A circle不能包含其他形狀。根據MDN docs它可能只包含descriptive elements和animation elements。這些類別不包括形狀，如circle或use。

而不是嵌套你的形狀，你應該創建一個父g和追加circle和use到：

// Create a `g`, rather than a `circle`, for each data point 
var groups = svg.selectAll(".group").data(data).enter().append("g") 
       .attr("class", "group"); 

// Append a `circle` to the new g 
groups.append("circle") 
       .attr("cx",100).attr("cy",100).attr("r",20); 

// Append a `use` to the new g 
groups.append("use").attr("xlink:href", "#mySymbol"); 

JSFiddle