用於替換SVG + XML文件

Question

我使用Fabric.js創建畫布。我可以用canvas.toSVG（）保存整個畫布作爲SVG + XML數據。我試圖實現的是獲得我的畫布的動態圖像，當發生某種事件時（在這種情況下，它是onclick mybutton）。

現在我想用舊SVG我的對象標籤內更換新的SVG。 我現在的做法：

HTML

<input type="button" value="thumbMe" onclick="canvas2svg();" id="refresh" /> 
<object data="test2.xml" type="image/svg+xml" id="emb1" name="emb1" width="1000"> 
</object> 

的JavaScript

function canvas2svg() { 
    var elem = document.getElementsByTagName("object")[0], 
     copy = elem.cloneNode(), 
     newsvg = canvas.toSVG(); 
    copy.data = testsvg; 
    elem.parentNode.replaceChild(copy, elem); 
} 
document.getElementById('refresh').onclick = canvas2svg; 

問題 通過運行此，我的對象元素的數據屬性如下所示：

<object data="&lt;?xml version=&quot;1.0&.... and so on... </object> 

這是因爲從newsvg的XML的全部內容的數據屬性中解析。我需要的只是替換對象標籤內的內容。有誰知道我的問題的解決方案？

Answer 1

我解決我的問題，創造一個Fabric.JS帆布另一種方法的動態略圖。 請看下面的代碼：

HTML

<input type="button" value="thumbMe" onclick="canvas2png();" id="refresh" />  
<img src="placeholder.png" /> 

的JavaScript

function canvas2png() { 
var img = canvas.toDataURL("image/png"), 
    elem = document.getElementsByTagName("img")[0], 
    elem.src = img; 
} 
document.getElementById('refresh').onclick = canvas2png; 

希望這有助於任何人。