SVG 坐标系统概念

一、简介

• SVG 主要用到的是 笛卡尔直角坐标系

  • 原点

  • 互相垂直的两条数轴

  • 角度定义

  • 通常数学角度来看是 逆时针，Y 轴朝上，但是 SVG 的坐标系是 顺时针，Y 轴朝下。

    

    

二、四个坐标系

• 用户坐标系 (User Coordinate) - 世界的坐标系

  

• 自身坐标系 (CurrentCoordinate) - 每个图形元素或分组独立与生俱来

  

• 前驱坐标系 (Previous Coordinate) - 父容器的坐标系

  

• 自身坐标系 与 前驱坐标系 案例：

  

• 参考坐标系 (Reference Coordinate) - 使用其它坐标系来考究自身的情况时使用