在已绘制的SVG中绘制

我想知道它是否可行以及如何绘制已绘制的SVG。假设我用SVG绘制了一些东西，但我想添加另一个元素，而不再绘制所有的地图或修改原始的鳕鱼。在已绘制的SVG中绘制

2013-05-04 Stanciu Alexandru-Marian

是的，它可以做到。其实，这是svg的优势之一。这里是一个例子：

<!DOCTYPE html> 
<html> 
    <head> 
     <title>HTML5 SVG demo</title> 
    </head> 

    <body> 
     <h1>SVG DEMO</h1> 
     <svg id="circle" height="200" xmlns="http://www.w3.org/2000/svg"> 
     <circle id="greencircle" cx="30" cy="30" r="30" fill="green" /> 
     </svg> 



     <script type="text/javascript"> 

      var rect = document.createElementNS('http://www.w3.org/2000/svg', 'rect'); 
      rect.setAttributeNS(null,"id", "myrect"); 
      rect.setAttributeNS(null,"fill", "red"); 
      rect.setAttributeNS(null,"stroke", "black"); 
      rect.setAttributeNS(null,"stroke-width", "5"); 
      rect.setAttributeNS(null,"x", "100"); 
      rect.setAttributeNS(null,"y", "100"); 
      rect.setAttributeNS(null,"width", "100"); 
      rect.setAttributeNS(null,"height", "50"); 
      var svg = document.getElementById("circle"); 
      svg.appendChild(rect); 


     </script> 
    </body> 
</html>

来源

2013-05-04 10:47:11 Alex

非常感谢！ – 2013-05-04 11:18:19

不客气。 – Alex 2013-05-04 11:38:15

在已绘制的SVG中绘制

回答

相关问题