1
這是一個抽象問題。我引用邁克·博斯托克的代碼導入外部svg
文件:http://bl.ocks.org/mbostock/1014829D3js - 單個外部SVG文件的多個實例
我的計劃是使用外部SVG
作爲icon
(或sprite
),將在一個界面中多次使用。有沒有一種方法可以在下面創建xml.documentElement
的副本?總之,如何在不爲每個實例加載文件的情況下創建一個svg
文件的多個實例?
d3.xml("rect01.svg", "image/svg+xml", function(xml) {
document.body.appendChild(xml.documentElement);
});
的最終目標是一個外部svg
添加到每個細胞在從這個例子中創建的網格:http://bl.ocks.org/bunkat/2605010
引用上面的鏈接,一個人如何工作的xml.documentElement
數據轉換成代碼中的柵格下面,這樣外部svg
是可見的,而不是一個矩形?
var col = row.selectAll(".cell")
.data(function (d) { return d; })
.enter().append("svg:rect")
.attr("class", "cell")
.attr("x", function(d) { return d.x; })
.attr("y", function(d) { return d.y; })
.attr("width", function(d) { return d.width; })
.attr("height", function(d) { return d.height; })
.on('mouseover', function() {
d3.select(this)
.style('fill', '#0F0');
})
.on('mouseout', function() {
d3.select(this)
.style('fill', '#FFF');
})
.on('click', function() {
console.log(d3.select(this));
})
.style("fill", '#FFF')
.style("stroke", '#555');
}
包括他們通過'
我想我在這裏找到了很好的領導:http://jsfiddle.net/christopheviau/XnG6r/ – ekatz