一、SVG简介
1.使用XML描述的矢量文件
2.W3C标准（https://www.w3.org/TR/SVG11/）
3.浏览器支持情况（https://caniuse.com/#cats=SVG）
二、基本图形和属性
1.基本图形
、、、、、
2.基本属性
fill、stroke、stroke-width、transform
(1) 矩形

• x
• y
• width
• height
• rx<可以定义圆角矩形>
• ry
  (2) 圆
• cx<圆心的位子>
• cy
• r<圆的半径>
  (3) 椭圆
• cx
• cy
• rx
• ry
  <4> 直线
• x1
• y1
• x2
• y2
  <5> 折线
• points 格式(xi,yi)+
  <6> 多边形
• points 格式(xi,yi)+

3.填充、描边和变换

• fill fill=#ffb3ae
• stroke stroke = 971817
• stroke-width strokeWidth = 10
• transform transform=”rotate(30)”

4.基本操作API

• 创建图形 document.createElementNS(ns,tagName)
• 添加图形 element.appendChild(childElement)
• 设置/获取属性 element.setAtteibute(name,value)、element.getAttribute(name)

5.SMIL for SVG - 轨迹移动

• 设置轨迹路径