关闭

xml矢量图:svg的path元素

标签: pathxmlclasshtmlcie
2681人阅读 评论(0) 收藏 举报

一个典型的path元素:
  <path id="xxx" class="yy" d="M 228.231 191.802 c -1.5351,-0.2647 -1.9586,-0.4764 -2.5409,-1.0587 -0.3706,-1.1117 -0.7411 z" />

  在path元素中id、class与普通html意义一样。最重要的是描述路径的d属性,主要命令如下:
 
  M 路径的起点 如
     M x坐标,y坐标
    
  L,V,H 直线
     L x坐标,y坐标 (和M配合,组成一条完整直线;同类命令有 V 垂直线,和 H 水平线)
    
  A 弧线
     A 半径x,半径y 弧度 [large arc flag],[sweep flag] 终点x,终点y
       [large arc flag],[sweep flag]:
        0,0  Y轴逆时针旋转
        0,1  Y轴顺时针旋转
        1,0  X轴逆时针旋转
        1,1  X轴顺时针旋转

  C,S,Q,T 贝塞曲线
    三次贝塞曲线
     C 关键点1x,关键点1y 关键点2x,关键点2y 终点x,终点y
    二次贝塞曲线 
     S 关键点2x,关键点2y 终点x,终点y
     Q 关键点1x,关键点1y 终点x,终点y
    映射
     T 终点x,终点y
    
  Z 闭合点
    将线连到原点闭合路径
    

  1.指令大写是绝对坐标,使用相应小写就指相对坐标。
  2.如果转换到IE VML的path属性,c必须替换为v,z替换为x,坐标值全为整数。 

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:163982次
    • 积分:1987
    • 等级:
    • 排名:第19654名
    • 原创:36篇
    • 转载:9篇
    • 译文:0篇
    • 评论:35条
    文章分类
    最新评论