d3.js - d3.js。documentFragment を SVG に追加するには?

Question

jsfiddleで私の例を参照してください。1 つの赤rectは静的マークダウンとして存在します。2 番目の緑rectは、appendメソッドを使用して追加されます。青はどこrect？rect青がすでに要素内に挿入されているドキュメント インスペクターで確認できますが、表示されsvgません。なんで？を使用してSVGに大量の長方形を挿入しようとしましdocumentFragmentたが、それらはすべて表示されません...

Answer 1

rectがsvg rectであり、神話上のhtml rect要素ではないことを伝えて、d3を支援する必要があるようです。例えば

var svg = d3.select("svg");
svg.append("rect")
    .attr("width", 50)
    .attr("height", 50)
    .attr("x", 50)
    .attr("y", 0)
    .attr("fill", "green")
var documentFragment = document.createDocumentFragment();
d3.select(documentFragment).append("svg:rect")
    .attr("width", 50)
    .attr("height", 50)
    .attr("x", 100)
    .attr("y", 0)
    .attr("fill", "blue")
console.log(documentFragment);
svg.node().appendChild(documentFragment);

確かではありませんが、これは d3 のバグである可能性があります。