D3.js -можно ли использовать пути отсечения с d3.svg.symbol?

Я пытаюсь нарисовать несколько символов «крест» внутри круга для использования в визуализации. Я хотел бы нарисовать кресты в теге «g», а затем применить обтравочный контур.

Можно ли использовать пути клипа с d3.svg.symbol?

В приведенном ниже примере круг svg правильно замаскирован путем обрезки; однако крест (последней части кода )не является.

Я что-то не так делаю или это не фича?

var svg = d3.select("#maskingExample")
   .append("svg:svg")
   .attr("width", 500)
   .attr("height", 200);

svg.append("svg:clipPath")
   .attr("id", "clipper")
   .append("svg:rect")
   .style("stroke", "gray")
   .style("fill", "black")
   .attr("x", 50)
   .attr("y", 25)
   .attr("width", 300)
   .attr("height", 45);

svg.append("g").append("svg:circle")
   .style("stroke", "gray")
   .style("fill", "blue")
   .attr("cx", 175)
   .attr("cy", 55)
   .attr("r", 50)
   .attr("clip-path", "url(#clipper)");

svg.append("g").append("path")
   .attr("d", d3.svg.symbol()
   .size( function(d) { return 3000; })
   .type( function(d) { return d3.svg.symbolTypes[1]; }))
   .attr("transform", "translate(150, 50)")
   .attr("clip-path", "url(#clipper")
   .style("fill", "black");
0
задан user1439837 6 June 2012 в 13:21
поделиться