0
点赞
收藏
分享

微信扫一扫

svg 缩写含义

言诗把酒 2022-03-12 阅读 49
前端
### svg 缩写的含义

```
 M 代表 MoveTo 移动到 两个参数 x,y  x代表x 坐标 y代表y 坐标
 L 代表 LineTo 划线到 两个参数x,y  x代表x坐标 y 代表y坐标
 l 代表 LineTo 划线到 两个参数x,y  x代表相对坐标 y代表相对坐标 与上个点的相对坐标
 H 代表 HorizonTo 代表水平位置 一个参数 代表水平位置
 V 代表 VerticalTo 代表垂直方向 一个参数 代表垂直位置
 h 代表  HorizonTo吧相对水平位置移动
 v 代表  VerticalTo 垂直方向 一个参数 代表水平垂直移动
 Z 代表 闭合close Path 代表闭合线
 S 代表 曲线 也可以画曲线链接起来  如果S命令跟在一个C或S命令后面,则它的第一个控制点会被假设成前一个命令曲线的第二个控制点的中心对称点
 C 代表 三次Bezier  贝塞尔 曲线  C x1 y1, x2 y2, x y (or c dx1 dy1, dx2 dy2, dx dy)  两个控制点 x1,y1  x2,y2  终点x,y
 Q 代表 二次Bezier 贝塞尔曲线 Q x1 y1, x y (or q dx1 dy1, dx dy)
 T 代表链接 二次贝塞尔曲线
 A 代表 arc 代表弧度 A rx ry x-axis-rotation large-arc-flag sweep-flag x y   rx代表x坐标半径 ry 代表y坐标半径 x-axis-rotation 代表旋转角度 large-arc-flag 1代表大角度弧  0代表小角度弧  sweep-flag表示弧线的方向,0表示从起点到终点沿逆时针画弧,1表示从起点到终点沿顺时针画弧 
 <path d="M10 10 H 90 V 90 H 10 L 10 10"/>
 这个含义就算 移动到x坐标10,y坐标10,开始划线到水平位置的90,划线到垂直方向90,回到水平位置10,连线到10,10 位置


```
举报

相关推荐

0 条评论