[D3] Fundamentals – SVG

The Basic Syntax of SVG

A Rectangle
<svg width="50" height="50">
  <rect x="0" y="0" width="50" height="50" />
</svg>

  


A Circle
<svg width="50" height="50">
  <circle cx="25" cy="25" r="25" />
</svg>

  


An Ellipse
<svg width="50" height="50">
  <ellipse cx="25" cy="25" rx="15" ry="10" />
</svg>

  


A Straight Line
<svg width="50" height="50">
  <line x1="5" y1="5" x2="40" y2="40" stroke="gray" stroke-width="5" />
</svg>

  


A Polyline
<svg width="50" height="50">
  <polyline fill="none" stroke="blue" stroke-width="2"
    points="05,30
            15,30
            15,20
            25,20
            25,10
            35,10" />
</svg>

  


A Polygon
<svg width="50" height="50">
  <polygon fill="yellow" stroke="blue" stroke-width="2"
    points="05,30
            15,10
            25,30" />
</svg>

  

您可在此處留言

avatar

這個網站採用 Akismet 服務減少垃圾留言。進一步瞭解 Akismet 如何處理網站訪客的留言資料

  Subscribe  
Notify of