Trouble drawing a pie chart with SVG

I'm working in a SVG small system to draw charts (line, bar and pie) and I'm having some weird issues with the pie chart... When the sections in the chart are smaller than the half of the circle, the function works perfectly and everything gets drawn correctly (see the image below):

However, when a portion of the pie is bigger than the half of the circle, the portion is drawn wrong, as if the center of the arc was moved (see the image below and note that the red part is the "empty" circle where the portions have to be drawn: I'm filling it with red color to check if portions are drawn correcly or not):

I'm using SVG's "path" function with absolute parameters to draw each pie portion. I'm passing some parameters to the function:

$circleCenter_ corresponds to the X and Y position of the center of the circle. $valPos[i][0-1] contains the X and Y position of each point of the triangle formed by the center and the two points on the circle (where the portion should end).

Here is the "path" I'm using:

<path d="M<?php echo $circleCenterX." ".$circleCenterY; ?> 
L<?php echo $valPos[$i][0][0].",".$valPos[$i][0][1] ?> 
A<?php echo $circleRadius.",".$circleRadius; ?> 0 0,1 <?php echo $valPos[$i][1][0].",".$valPos[$i][1][1]; ?> Z" 
(...) />

I don't understand why it works fine when the portion is less than the circle half, and why it seems like the center is "moved" when the portion is bigger than the circle half. Of course the $circleCenter variables are never modified inside the pie drawing function...

Any clue about this?

Thanks in advance for your time and effort! :)

---

如果该部分的百分比大于50％，则需要将大弧标志设置为1。

链接地址: http://www.djcxy.com/p/76492.html

上一篇: 定位SVG路径后使用for循环绘制线

下一篇: 无法用SVG绘制饼图