资料来源 imooc 慕课网
1.1 位图 & 矢量图
1.2 基本图形
rect
circle
ellipse
line
polyline
polygon
The following commands are available for path data:
• M = move to
• L = line to
• H = horizontal line to
• V = vertical line to
• C = curve to
• S = smooth curve to
• Q = quadratic Bézier curve 二次贝塞尔曲线
• T = smooth quadratic Bézier curveto 光滑二次贝塞尔曲线
• A = elliptical Arc 椭圆弧
• Z = close path
填充 描边 和 变换
- fill
- stroke
- stroke-width
- transform
1.3 基本操作API
创建图形:
document.createElementNS(namespaceURI, qualifiedName[, options]);
namespaceURI
:string that specifies the namespace to associate with the element.
qulifiedName
:A string that specifies the type of element to be created > a nodeName
optiond
:A optional object ElementCreationOptions containing a single property namedis
, whose value is the tag name for a custom element previously defined usingcustomElements.define()
.
(创建之后记得用appendChild()
添加)添加图形:
document.appendChild(childElement)
获取 / 设置:
element.setAttribute(name, value)
element.getAttribute(name)