<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="折線圖" xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="300px"
height="300px" viewBox="0 0 600 600" enable-background="new 0 0 600 600" xml:space="preserve">
<dfs>
<line id="arrow_left" style="stroke:rgb(0,0,0);stroke-width:5;" x1="0" y1="0" x2="40" y2="0"/>
<g id="arrow">
<use xlink:href="#arrow_left" transform="rotate(-55 40,0)"/>
<use xlink:href="#arrow_left" transform="rotate(235 40,0)"/>
<line style="stroke:rgb(0,0,0);stroke-width:5;" x1="40" y1="0" x2="40" y2="540"/>
</g>
</dfs>
<use xlink:href="#arrow" x="0" y="0" />
<polyline points="40,424.408 171.238,291.143 280.37,354.912 533,100" fill="none" stroke-linecap="round" stroke-linejoin="round"></polyline>
<use xlink:href="#arrow" x="0" y="0" transform="rotate(90 40,540)"/>
</svg>
前戲：想想各種筆畫（line倒戏、polyline等）畫在一個(gè)巨大的坐標(biāo)系上。
劇情：
viewBox：從坐標(biāo)系上 crop 一個(gè)矩形作為視野憔足，即 SVG 的內(nèi)容
svg.width/svg.height:定義 SVG 在頁面中占據(jù)的范圍
enable-background：不詳（用 illustrator 時(shí)帶出來的屬性）
dfs：定義一些基礎(chǔ)“組件”，定義不會被顯示
use：引用定義中的基礎(chǔ)“組件”
g：將基本元素“打包”（分組）甥角，以便作為一個(gè)整體來操作
transform：變換垦搬，rotate(旋轉(zhuǎn)角度呼寸，旋轉(zhuǎn)中心x，y)
