【翻译svg教程 】svg 的坐标系统-阿里云开发者社区

开发者社区> 云计算> 正文

【翻译svg教程 】svg 的坐标系统

简介: http://tutorials.jenkov.com/svg/svg-coordinate-system.html svg的坐标系统(和大多数计算机绘图的坐标系统)和数学中绘图系统有点不一样 数学/笛卡儿坐标系统 数学中的坐标系统是这样的 原点在左下角 SVG坐标系统 svg的坐标系统 原点在左上角 SVG 坐标系统的单位 你可以指定在SVG坐标系单位。

http://tutorials.jenkov.com/svg/svg-coordinate-system.html

svg的坐标系统(和大多数计算机绘图的坐标系统)和数学中绘图系统有点不一样

数学/笛卡儿坐标系统

数学中的坐标系统是这样的

QQ截图20141214105856

原点在左下角

SVG坐标系统

QQ截图20141214110055

svg的坐标系统 原点在左上角

SVG 坐标系统的单位

你可以指定在SVG坐标系单位。你到处都可以指定一个坐标(x和y位置,宽度和高度等)。您指定的单位价后,例如10厘米或125毫米。

如果不指定任何单位协调值后,单位被认为是像素(px)。

svg 单位列表

em 默认高度,通常是行高 The default font size - usually the height of a character.
ex 一个字母x的高度? The height of the character x
px 像素 最常用的
pt Points (1 / 72 of an inch)
pc Picas (1 / 6 of an inch)
cm Centimeters
mm Millimeters
in Inches

一般用 em 和 px 比较多

test

版权声明:本文首发在云栖社区,遵循云栖社区版权声明:本文内容由互联网用户自发贡献,版权归用户作者所有,云栖社区不为本文内容承担相关法律责任。云栖社区已升级为阿里云开发者社区。如果您发现本文中有涉嫌抄袭的内容,欢迎发送邮件至:developer2020@service.aliyun.com 进行举报,并提供相关证据,一经查实,阿里云开发者社区将协助删除涉嫌侵权内容。

分享:
云计算
使用钉钉扫一扫加入圈子
+ 订阅

时时分享云计算技术内容,助您降低 IT 成本,提升运维效率,使您更专注于核心业务创新。

其他文章