网格
对于所有元素，SVG 使用一个坐标系或网格系统，该系统与 canvas（以及许多其他计算机绘图例程）使用的系统类似。也就是说，文档的左上角被认为是点 (0,0) 或原点。然后，位置从左上角开始以像素为单位进行测量，正 x 方向向右，正 y 方向向下。
请注意，这与您小时候学习的绘图方式略有不同（y 轴是颠倒的）。但是，这与 HTML 中元素定位的方式相同（默认情况下，LTR 文档被视为不是 RTL 文档，后者从右到左定位 X）。
示例
元素
<rect x="0" y="0" width="100" height="100" />
定义一个矩形，从左上角开始，向右跨越 100px，向下跨越 100px。
什么是“像素”？
在最基本的情况下，SVG 文档中的一个像素映射到输出设备（即屏幕）上的一个像素。但是，如果 SVG 没有“可缩放”这个词，它就不会有多个选项来改变这种行为。就像 CSS 中的绝对和相对字体大小一样，SVG 定义了绝对单位（带有“pt”或“cm”等尺寸标识符的单位）和所谓的用户单位，后者缺少该标识符，是纯数字。
在没有进一步说明的情况下，一个用户单位等于一个屏幕单位。要明确更改此行为，SVG 中有几种可能性。我们从 svg 根元素开始
<svg width="100" height="100">…</svg>
上面的元素定义了一个 100x100px 的 SVG 画布。一个用户单位等于一个屏幕单位。
<svg width="200" height="200" viewBox="0 0 100 100">…</svg>
整个 SVG 画布的大小为 200x200 像素。但是，viewBox 属性定义了要显示的画布部分。这 200x200 像素显示了一个从用户单位 (0,0) 开始并向右和向下跨越 100x100 用户单位的区域。这有效地放大了 100x100 单位区域，并将图像放大到两倍大小。
当前用户单位到屏幕单位的映射（对于单个元素或整个图像）称为用户坐标系统。除了缩放之外，坐标系统还可以进行旋转、倾斜和翻转。默认的用户坐标系统将一个用户像素映射到一个设备像素。（但是，设备可以决定它理解的像素是什么。）SVG 文件中具有特定尺寸（如“in”或“cm”）的长度的计算方式使其在最终图像中显示为 1:1。
SVG 1.1 规范中的一段话说明了这一点
[...] 假设用户代理可以从其环境中确定“1px”等于“0.2822222mm”（即 90dpi）。那么，对于所有 SVG 内容的处理： [...]“1cm”等于“35.43307px”（因此等于 35.43307 用户单位）