美文网首页
SVG指令 知道这些就够了

SVG指令 知道这些就够了

作者: MQLX | 来源:发表于2017-08-19 22:32 被阅读0次

SVG指令常用来编辑图标等图片资源,当然,Android,也支持SVG指令设计图片,这篇博客收录了几个常用指令用法,可供用时查阅~

首先,使用下列指令时需要注意:

1、坐标轴以(0,0)为中心,x轴水平向右,y轴水平向下

2、所有的指令大小写均可,大写代表绝对定位,参照坐标轴,小写代表相对定位,参照当前画笔所在位置。

下面看看都有哪些常用指令吧~

1、将画笔移动到某一点

M X,Y

效果:将画笔移动到(x,y)位置,此时并没有绘图

2、绘制直线

L X,Y

效果:以当前画笔位置为起点,以(x,y)为终点,绘制一条直线

3、绘制弧线

A RX,RY,XROTATION,FLAG1,FLAG2,X,Y

其实弧线可以看作是一个椭圆的一部分,另外,弧线的起点就是当前画笔所在的位置

RX、RY:椭圆的半轴大小

XROTATION:椭圆X轴与水平方向顺时针方向的夹角大小

FLAG1:只有两个值,1代表取大角度弧线,0代表取小角度弧线

FLAG2:只有两个值,确定绘制的方向,1代表顺时针,0代表逆时针

X、Y:终点坐标值

4、绘制三次贝塞尔曲线

C X1,Y1,X2,Y2,ENDX,ENDY

关于贝塞尔曲线可以学习这个博客

起点就是当前画笔所在的位置

X1、Y1:参照点1的坐标

X2、Y2:参照点2的坐标

ENDX、ENDY:终点坐标

S X,Y,ENDX,ENDY

起点就是当前画笔所在的位置

X、Y:参照点坐标

5、绘制二次贝塞尔曲线

Q X,Y,ENDX,ENDY

起点就是当前画笔所在的位置

X、Y:参照点坐标

ENDX、ENDY:终点坐标

6、闭合路径

Z


MQL于2017年8月19日完成本文。

相关文章

  • SVG指令 知道这些就够了

    SVG指令常用来编辑图标等图片资源,当然,Android,也支持SVG指令设计图片,这篇博客收录了几个常用指令用法...

  • Markdown:知道这些就够了

    推荐编辑器 Chrome最佳插件 - 马克飞象 跨平台软件,印象笔记爱好者肯定需要 - Haroopad/Subl...

  • 床垫:知道这些就够了

    思维导图 引言 睡眠不只事关明天,而是在今后的二十年里都很重要。睡在不合适的床垫上是引起背痛的一个主要原因 你与床...

  • 搞定英语,知道这些就够了!

    搞定英语,知道这些就够了 英语,这对于我们来说完全就是一个老生长谈的问题。 在我们十几年的学生生涯中他一直伴随我们...

  • git命令知道这些就够了

    git的commit分三个区域以及三个阶段: working tree:就是你所工作在的目录,每当你在代码中进行了...

  • 日语入门,知道这些就够了

    入门之一:什么是假名?什么是五十音图? 假名 日语的字母叫做假名,每个假名代表一个音节。假名有两种书写方式,即平假...

  • 自我解压,知道这些就够了

    1、现状 社会发展越来越快,人们的生活节奏也变得很难够停得下来,来自工作、学习、交际、家庭等等各个方面的压力让很多...

  • 7.html5 笔记3 svg

    SVG 教程在线画svg path的各种指令, 就很类似 canvas的画图方式.image.pngimage.p...

  • 前端切图,知道这些就够了

    相信每一个刚上手项目的前端都会被这种七零八碎的PS切图搞得晕头转向,下面就来一篇干货,传授前端切图的每一项必杀技,...

  • 清迈丛林飞跃,知道这些就够了!

    清迈有茂密的热带森林、高山峡谷、终年凉爽的气候和极好的丛林跳跃条件。 在清迈有很多丛林飞行公司,丛林飞行很危险吗?...

网友评论

      本文标题:SVG指令 知道这些就够了

      本文链接:https://www.haomeiwen.com/subject/zijxdxtx.html