rotate(30 20,90):这里的三个数字分别代表了什么意思？

发布于
2016-09-18

<!DOCTYPE html>
<html>
<body>

<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
  <text x="0" y="15" fill="red" transform="rotate(30 20,90)">I love SVG</text>
</svg>
 
</body>
</html>

rotate(30 20,90):这里的三个数字分别代表了什么意思？
各位大神讲解一下，我没有百度到。。

html

阅读 8.8k

4 个回答

某熊猫桑

✓ 已被采纳

（这种东西我觉得百度不如直接查手册快……）
查了下MDN上的transform属性词条，看到定义是rotate(<a> [<x> <y>])，所以三个数字分别是角度和xy坐标。

已注销

324215

发布于
2016-09-18

SVG transform 属性下有几个转换函数。rotate用来使目标对象绕一点旋转一定的角度。rotate的格式如下：

   rotate([angle] [px,py])

参数介绍：

   [angle] : 旋转角度。 由于屏幕坐标和数学坐标的Y轴相反，所以向左旋转为正角度值。
   [px,py] : 旋转的中心点。参数缺省默认为圆点（0,0）。

半叶森

791117

发布于
2016-09-18

没具体研究过，你查查css3里面的transform:rotate()应该就能明白了。
2D旋转，svg和一般的dom写的方式不一样而已

lghuahua

3371512

发布于
2016-09-18

看一下这个http://www.tuicool.com/articl...

撰写回答

你尚未登录，登录后可以

和开发者交流问题的细节
关注并接收问题和回答的更新提醒
参与内容的编辑和改进，让解决方法与时俱进

推荐问题

相似问题

找不到问题？创建新问题

rotate(30 20,90):这里的三个数字分别代表了什么意思？

你尚未登录，登录后可以

问一个鼠标滚动事件，这种是怎么实现的？

css如何设置纵向滚动条的高度？

form对象根据表单dom元素的name属性获取元素对象是基于什么标准的？兼容性如何？

Vue为什么说textarea标签不支持插值表达式的？

threejs用octree实现房间内第三人称漫游并且添加了碰撞，人物在碰撞到墙壁的时候不停的弹回，应该怎么修改才能不会疯狂的弹回？

单页应用网站缓存不是由于index.html文件被缓存导致的吗？

election嵌套了一个web项目通信为什么会中断?