按百分比绘制饼图

Question

如何使用ImageMagick按百分比绘制饼图？

例如:如果以百分比形式给出45之类的值 - 如何使用Ruby或bash命令绘制仅有45%的饼图？

如果我使用ImageMagick的draw运算符,需要如何设置弧值？或者我如何从整数值计算acr值？

例如:

convert -size 100x100 xc:none -fill white -stroke black/
-draw "path 'M 30,40   A 1,1  0  0,0 70,20 ....  ??

我试着阅读并理解这些例子,但弧形计算对我来说是一个谜.

Answer 1

ImageMagick的draw操作实现了本W3C文档中定义的SVG"路径" .

不支持通过给出简单的"度"角度参数进行绘制.您需要使用三角函数计算每个路径的终点坐标和涉及弧的子路径.(您必须使用绝对值或相对于当前点的相对值,具体取决于使用的确切弧算子;另请参见下面的示例.)

一般

在SVG(和ImageMagick)中,'path'表示对象的轮廓.还支持绘制复合路径:复合路径是具有子路径的路径,其中每个子路径由一个moveto后跟一个或多个line或curve操作组成.

对象的轮廓可以通过以下操作定义:

• moveto : 设置一个新的当前点.
  使用M绝对和m相对运动.

• lineto : 画一条直线.
  使用L绝对和l相对运动.

• curveto : 绘制贝塞尔曲线.
  使用C,c,S和s绘制三次Bezier曲线.(饼图不需要这些).
  使用Q,q,T和t绘制*二次贝塞尔曲线.(饼图不需要这些).

• arc : 绘制椭圆形或圆弧形.
  使用A和a绘制椭圆弧.对于椭圆==圆的特殊情况,我们需要这些饼图.

• closepath : 通过在最后一次移动中画一条线来关闭当前形状. 使用Z或z; 两者具有相同的效果:它们结束当前子路径并导致从当前点到当前子路径的初始点绘制自动直线.

  • 如果"closepath"紧跟"moveto",则"moveto"标识下一个子路径的起始点.
  • 如果紧接着任何其他命令的"closepath",则下一个子路径在与当前子路径相同的初始点开始.

单个饼图楔形示例

这意味着,您可以使用此命令在黄色背景下使用黄色背景在280x280画布内绘制带有黑色边框的单个红色饼图楔形:

convert         \
  -size 280x280 xc:yellow \
  -stroke black \
  -fill blue    \
  -draw "path 'M 120,140  L 120,40  A 100,100 0 0,1 137.36,41.52  Z'" \
   red-pie-wedge.jpg

结果:

1. 以下坐标系的原点是左上角.
2. 路径的起点(M)位于像素坐标(120/140).
3. 第一行(L)从那里垂直向上绘制到坐标(120/40).
4. 从坐标(120/40)开始A,半径为100的圆弧()到达坐标(137.36/41.52).
   我将把它留给读者来计算导致坐标(137.36/41.52)作为弧的终点的三角计算.提示:
   • 楔角为10°,100*sin(10°)= 17.36,因为本例中的半径为100,因此120 + 17.36 = 137.36 ;
   • cos(10°)= 0.9848和100*(1-cos(10°))= 1.52,因此40 + 1.52 = 41.52.
5. 从弧的终点开始,路径闭合(Z),直线返回路径的起点.

完成饼图示例

您总是需要进行一些三角函数数学来计算绘制所有饼形楔所需的任何圆弧的端点.

以下是完整饼图的示例,其中包括上面的蓝色饼图:

convert                  \
 -size 280x280 xc:yellow \
 -stroke black           \
 -fill blue   -draw "path 'M 120,140  L 120.00,40.00  A 100,100  0 0,1  137.36,41.52  Z'" \
 -fill silver -draw "path 'M 120,140  L 137.36,41.52  A 100,100  0 0,1  154.20,46.00  Z'" \
 -fill red    -draw "path 'M 136,130  L 170.20,36.00  A 100,100  0 0,1  236.00,130.00 Z'" \
 -fill green  -draw "path 'M 120,140  L 220.00,140.00 A 100,100  0 1,1  120.00,40.00  Z'" \
 -fill black  -stroke none  -pointsize 10 \
 -draw "text 119,37 '10' text 142,41 '10' text 182,36 '70' text 226,156 '270'" \
  piechart.jpg

结果: