svg 中 path 画弧的一个纠结的问题

Dive into HTML5

This topic created in 4424 days ago, the information mentioned may be changed or developed.

命令和参数: A (r r 0 0|1 0|1 x y)

参数解释:

1) 第1、2参数：圆弧的半径；

2) 第3参数：固定为0；

3) 第4参数：0表示小于180度的弧，1表示大弧；

4) 第5参数：0为表示弧在路径前进方向的右边，1表示在左边；

5) 第6、7参数：弧的终点坐标，此点同时作为下一园弧或命令A、L的当前点
====

问题来了 4）是什么意思？
看了
https://developer.mozilla.org/zh-CN/docs/Web/SVG/Tutorial/Paths
还是没懂这几个参数到底怎么用才能画出一个正常的饼状图中的弧。

参数

弧

命令

3 replies • 2014-07-10 04:55:16 +08:00

imn1

Jul 7, 2014

自己试一下不就清楚了？
你给的链接后面就有个很清晰的例子了

dong3580

Jul 9, 2014

@imn1
看了一天半，总算明白了。
3ks
～～～
事实上网上的讲解有点不妥。
应该这样：
M x1 y1 起点坐标；
A (r1 r2 0 0|1 0|1 x2 y2)描述弧；
L x3 y3封口坐标，这样可以fill颜色，也可以写在前面。

imn1

Jul 10, 2014

M是moveto
L是lineto

http://pan.baidu.com/wap/shareview?&shareid=346812&uk=1728315473&dir=%2F%E6%95%99%E7%A8%8B%E8%B5%84%E6%96%99%2Fw3shool%E5%85%A8%E7%AB%99%E6%95%99%E7%A8%8B&page=2&num=20&fsid=2229457178&third=0
SVG教程