Question

我从这里给出的代码http://jbkflex.wordpress.com/2011/07/28/creating-a-svg-pie-chart-html5/获取帮助来创建一个饼图。但问题是，如果我用0替换其中的一些值。或者给出大的值，角度变得超过180，并且图表看起来很奇怪，如fiddle所示。这里给出了弧的x2和y2值

    x2 = parseInt(200 + 180 * Math.cos(Math.PI * endAngle / 180), 10);
    y2 = parseInt(200 + 180 * Math.sin(Math.PI * endAngle / 180), 10);

我可以带来一些变化吗？关于创建超过180度角的弧的一些有用提示将不胜感激！

Answer 1

如果角度为＆gt;则需要将largeArc标志设置为1。 180.改变你的小提琴就像这样......

var d = "M200,200  L" + x1 + "," + y1 + "  A180,180 0 " + ((endAngle - startAngle > 180) ? 1 : 0) + ",1 " + x2 + "," + y2 + " z"; //1 means clockwise

创建一些弧度超过180度的饼图

1 个答案: