【翻译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
相关文章
|
2月前
|
XML JavaScript 前端开发
SVG学习
【10月更文挑战第1天】
44 3
|
7月前
|
算法 前端开发
如何用SVG画一个特定边框(下)
如何用SVG画一个特定边框(下)
79 3
|
7月前
|
前端开发
如何用SVG画一个特定边框(上)
如何用SVG画一个特定边框(上)
88 1
|
前端开发
如何使用css制作一个三角形?
如何使用css制作一个三角形?
77 0
|
7月前
|
前端开发
css制作多边形
css制作多边形
85 0
|
前端开发 JavaScript
CSS奇思妙想之-利用CSS裁剪(clip-path)完成各种图形
CSS奇思妙想之-利用CSS裁剪(clip-path)完成各种图形
274 1
CSS奇思妙想之-利用CSS裁剪(clip-path)完成各种图形
|
XML 前端开发 JavaScript
推荐一个C#操作SVG图形矢量图的开源项目
一个支持.Net Framework 与 .Net Core版本的SVG图形操作库。这个项目集成了SVG各项API,让开发人员可以在.Net很轻松的实现SVG图形的操作,通过SVG文件转换为图片文件。
456 0
推荐一个C#操作SVG图形矢量图的开源项目
|
存储 前端开发 数据可视化
有意思!强大的 SVG 滤镜
有意思!强大的 SVG 滤镜
285 0
有意思!强大的 SVG 滤镜
|
前端开发 定位技术
openlayers3实现动态图标gif其他css支持的格式
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/gisdoer/article/details/80576541 原文:http://www.
2161 0