【D3.js数据可视化系列教程】（二十六）--加载svg文件

这个更简单

//加载svg

  d3.xml("http://localhost:8080/spring/D3data/Rect01.svg", "image/svg+xml", //加载文件
  function(xml) {
     document.body.appendChild(xml.documentElement);//添加DOM节点
  });

 

Rect01.svg文件

<?xml version="1.0" standalone="no"?> 
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="12cm" height="4cm" viewBox="200 200 1200 400"
     xmlns="http://www.w3.org/2000/svg" version="1.1">
  
  <desc>Example rect01 - rectangle with sharp corners</desc> 
 
  <!-- Show outline of canvas using 'rect' element --> 
  
  <rect x="100" y="1" width="1198" height="398"
        fill="none" stroke="blue" stroke-width="2"/> 
 
  <rect x="100" y="200" width="400" height="200"
        fill="yellow" stroke="navy" stroke-width="10"  /> 
</svg>