與D3.js

我試圖轉動外部SVG文件，D3.js.上點擊它時旋轉外部SVG文件我注意到SVG只允許像<g>，<circle>和<rect>標籤旋轉。我找不到一種方法來實現這一點。與D3.js

HTML：

<div id="canvasdiv" style="border: 1px solid black; width:800px; height: 600px"></div>

的Javascript：

// CREATE SVG DRAWING CANVAS 
var paper = d3.select("#canvasdiv") 
    .append("svg") 
    .attr("id", "canvas") 
    .attr("width", 800) 
    .attr("height", 600); 

// CREATE CONTAINER BOX FOR SVG FILE 
var innerSvg = paper.append("svg") 
    .attr("id", "iSvg") 
    .attr("x", 500) 
    .attr("y", 10) 

    .on("mousedown", function() { 
     d3.select(this) 
     .attr("transform", "rotate(90)"); 
    }); 

//IMPORT SVG FILE 
d3.xml("Boiler.svg", "image/svg+xml", function(xml) { 
    var importedNode = document.importNode(xml.documentElement, true); 
    d3.select("#iSvg").node().appendChild(importedNode); 
});

來源

2013-12-09 user2717511

你能簡單地'g'元素追加到您生成並旋轉SVG，雖然附加的外部SVG內容到'g'元素？ –

你可以添加你的座標軸到不同的'g'元素嗎？ –

謝謝，它的工作。 – user2717511

您可以添加g元素給你生成SVG和追加外部SVG到的內容。然後你可以旋轉它。你不想要的任何內容進行旋轉，你可以附加到其他g元素。

來源

2013-12-17 14:28:41

回答

相關問題