svg学习笔记
1、svg基本操作API
1、创建图形
document.createElementNS(ns, tagName)
2、添加图形
element.appendChild(childElement)
3、 设置/获取属性
element.setAttribute(name, value)
elememt.getAttribute(name)
注意:角度的顺时针方向为正方向。
2、颜色、渐变和笔刷
2-1、rgb 和 HSL
hsl(h, s%, l%) (示颜色、饱和度和亮度)(h: [0, 359] s, l: [0, 100])
3、viewBox
3-1、viewBox参数
viewBox=“x, y, width, height” // x:左上角横坐标,y:左上角纵坐标,width:宽度,height:高度
//实例:
<svg width="500" height="200" viewBox="0 0 50 20" style="border: 1px solid #234567;">
<rect x="20" y="10" width="10" height="5"
style="stroke: #000000; fill:none;"