如何在raphael.js文件中添加一個sub svg標籤？

我使用Raphael.js產生的SVG從Javascript（實際上的CoffeeScript）如何在raphael.js文件中添加一個sub svg標籤？

但是畫畫，我希望能夠包括subdrawings，自動縮放，通過把他們第二次<SVG>標籤內嵌套在第一個裏面。不幸的是，Raphael Paper對象允許我添加rects和路徑等，沒有添加svgs的選項。

我試圖直接與下面的代碼添加標籤到DOM在javascript：

res = document.createElement("svg") 
res.setAttribute("x",x) 
res.setAttribute("y",y) 
res.setAttribute("width",width) 
res.setAttribute("height",height) 
res.setAttribute("viewBox","0 0 100 100") 
res.innerHTML = someInnerSVG 
@paper.canvas.appendChild(res)

這似乎像預期的那樣更新DOM，加入我的新的SVG標記爲主要的孩子外部SVG。但是，屏幕上實際上並沒有內容。（我的內部SVG路徑在0 0 100 100範圍內縮放，因此位於視圖框內。）

由Raphael生成的外部SVG中的繪圖的其餘部分是可見的。但內在的一點是沒有的。

我應該怎麼做纔有可能？任何想法我做錯了什麼？

來源

2012-08-05 interstar

我不知道Coffeescript，但看起來你實際上並沒有向SVG元素添加任何東西。 – SomeKittens 2012-08-05 00:46:29

不是「res.innerHTML =」設置新SVG元素的innerHTML。而@ paper.canvas.appendChild然後將其添加到外部SVG。 – interstar 2012-08-05 02:09:11

是的，但在我看來，你正在追加一個空的SVG。嘗試在內部SVG中添加一個'rect'或其他元素。 – SomeKittens 2012-08-05 02:11:12

你應該將這些子元素放入Raphael集。從那裏，你將能夠應用轉換到設置。要轉換集，則需要調用transform()方法和使用s屬性：

set.transform('s[sx],[sy]');

哪裏sx水平縮放量和sy垂直縮放量。插入數字時刪除括號。

請參閱此處的文檔：http://raphaeljs.com/reference.html#Element.transform 元素的方法適用於集，因爲集是僞元素。

來源

2013-02-14 21:58:48 tnsingle

如何在raphael.js文件中添加一個sub svg標籤？

回答

相關問題