svg mysql_SVG介绍

SVG介绍

SVG是指可缩放矢量图(Scalable Vector Graphics)。SVG使用XML格式来定义图形。SVG可以直接嵌入到HTML页面中。

位图和矢量图

位图(Bitmap)是由很多具有自己颜色的像素组成的图像。放大后需要通过插值计算来补充像素，所以会失真。

矢量图的有点：

文件小

缩放，旋转或者改变图形不失真

线条，颜色平滑，锯齿不明显。

矢量图最终也要转成位图来表示。

SVG形状

SVG标签

...

SVG有七种图形元素。

矩形

style="fill: yellow; stroke: red; stroke-width:2; opacity:0.5" />

参数含义

x为矩形左上角x坐标

y为矩形左上角y坐标

width为矩形宽度

height为矩形高度

rx为圆角矩形椭圆在x方向上的半径

ry为圆角矩形椭圆在y方向上的半径

style用来指定样式

圆形

cx 和 cy 属性定义圆点的 x 和 y 坐标。如果省略 cx 和 cy，圆的中心会被设置为 (0, 0)

r 属性定义圆的半径。

椭圆形

参数：

cx 属性定义圆点的 x 坐标

cy 属性定义圆点的 y 坐标

rx 属性定义水平半径

ry 属性定义垂直半径

线段

参数：

x1 属性在 x 轴定义线条的开始

y1 属性在 y 轴定义线条的开始<