SVG 坐标系统
和很多计算机绘图所使用的坐标系统一样，SVG 也使用了网格坐标系统。这种坐标系有如下几个特点: 以左上角为坐标系的原点(0,0) X 轴的正方向向右，从 0,0 点开始向右， x 逐渐增大。Y 轴的正方向向下，从 0,0 点开始向下， y 逐渐增大。 坐标以像素为单位
SVG（和大多数其他计算机图形）的坐标系统与数学，图形等的坐标系略有不同。
数学/笛卡尔坐标系
在直角坐标系中，点x=0，y=0位于图形的左下角。随着x的增加，点在坐标系中向右移动。当x减小时，点在坐标系中向左移动。随着y的增加，点在坐标系中向上移动。当y减小时，点在坐标系中向下移动。
这是一个普通图形坐标系的图示，其左下角为0,0：
SVG坐标系统
在SVG坐标系中，点x=0，y=0是左上角。因此，与普通的图形坐标系相比，y轴是相反的。随着SVG中y的增加，点、形状等向下移动，而不是向上移动。
这是SVG坐标系的图示，左上角的0,0：
坐标系统单位
可以指定SVG坐标系中1个单位对应的单位。您可以在任何可以指定坐标（x和y位置，width和height等）的地方执行此操作。您可以在值后指定单位，例如10cm或125mm。
如果在坐标值后未指定任何单位，则假定该单位为像素(px)。
这是可以与SVG元素一起使用的单位的列表：
| 单元 | 描述 |
|---|---|
| em | 默认字体大小-通常是字符的高度。 |
| ex | 字符x的高度 |
| px | 像素 |
| pt | 点（1/72英寸） |
| pc | Picas（1/6英寸） |
| cm | 公分 |
| mm | 毫米 |
| in | 英制 |
<svg>在width和height 属性中 在元素上设置的单位仅影响该<svg> 元素（视口）。<svg>元素内的形状必须设置自己的单位。同样，如果未指定单位，则默认单位为像素。