关于WPF中的饼图

项目中要用到饼图,之前用Winform中的Chart控件,用一个WindowFormHost装载进来,凑合能用。

最近重新整理代码,看到程序目录下,引用的DLL不少,想用WPF自身的控件,可没找到(笨啊)

于是生出一想法:自己动手画一个吧。

给出xaml代码先:

 1             <Ellipse Fill="#97decd" 
 2                  HorizontalAlignment="Left" Height="200" Margin="10,0,0,0" VerticalAlignment="Top" Width="200" Stroke="#aaa" StrokeThickness="1"/>
 3             <Ellipse Fill="#054252" 
 4                  HorizontalAlignment="Left" Height="200" Margin="10,0,0,0" VerticalAlignment="Top" Width="200" Stroke="#aaa" StrokeThickness="1">
 5                 <Ellipse.Clip>
 6                     <PathGeometry>
 7                         <PathFigure StartPoint="100,100" x:Name="Ell1"/>
 8                     </PathGeometry>
 9                 </Ellipse.Clip>
10             </Ellipse>
XAML代码

之所以给出两个Ellipse,是用上面那个作背景,下面的才是显示百分比的图。

再来画图代码:

 1     class DrawPartOfEllipseService
 2     {
 3         private const int ELLIPSERADIUS = 100;
 4         /// <summary>
 5         /// 画扇形
 6         /// </summary>
 7         /// <param name="per">百分比</param>
 8         /// <param name="ell">椭圆的PathFigure</param>
 9         /// <param name="Radius">椭圆半径</param>
10         public static void Draw(double per, PathFigure ell,int Radius)
11         {
12             if (per > 100)
13             {
14                 return;
15             }
16             ell.Segments.Clear();
17             double AAA = per * 3.6 / 180 * Math.PI;
18             Point st = new Point(Radius, Radius);
19             Point st2 = new Point(Radius * 2, Radius);/*这两个点确定一个x轴正向*/
20             ell.Segments.Add(new LineSegment { Point = st });
21             ell.Segments.Add(new LineSegment { Point = st2 });
22             if (per <= 12.5)
23             {
24                 Point p1 = new Point();
25                 p1.X = Radius*2;
26                 p1.Y = Radius - Radius * Math.Tan(AAA);
27                 ell.Segments.Add(new LineSegment { Point = p1 });
28             }
29             else if (per <= 37.5)
30             {
31                 Point p1 = new Point(Radius*2, 0);
32                 ell.Segments.Add(new LineSegment { Point = p1 });
33                 Point p2 = new Point();
34                 p2.Y = 0;
35                 p2.X = Radius + Radius / Math.Tan(AAA);
36                 ell.Segments.Add(new LineSegment { Point = p2 });
37             }
38             else if (per <= 62.5)
39             {
40                 Point p1 = new Point(Radius*2, 0);
41                 Point p2 = new Point(0, 0);
42                 ell.Segments.Add(new LineSegment { Point = p1 });
43                 ell.Segments.Add(new LineSegment { Point = p2 });
44                 Point p3 = new Point();
45                 p3.X = 0;
46                 p3.Y = Radius + Radius * Math.Tan(AAA);
47                 ell.Segments.Add(new LineSegment { Point = p3 });
48             }
49             else if (per <= 87.5)
50             {
51                 Point p1 = new Point(Radius*2, 0);
52                 Point p2 = new Point(0, 0);
53                 Point p3 = new Point(0, Radius*2);
54                 ell.Segments.Add(new LineSegment { Point = p1 });
55                 ell.Segments.Add(new LineSegment { Point = p2 });
56                 ell.Segments.Add(new LineSegment { Point = p3 });
57                 Point p4 = new Point();
58                 p4.Y = Radius*2;
59                 p4.X = Radius - Radius / Math.Tan(AAA);
60                 ell.Segments.Add(new LineSegment { Point = p4 });
61             }
62             else
63             {
64                 Point p1 = new Point(Radius*2, 0);
65                 Point p2 = new Point(0, 0);
66                 Point p3 = new Point(0, Radius*2);
67                 ell.Segments.Add(new LineSegment { Point = p1 });
68                 ell.Segments.Add(new LineSegment { Point = p2 });
69                 ell.Segments.Add(new LineSegment { Point = p3 });
70                 Point p4 = new Point();
71                 p4.Y = Radius*2;
72                 p4.X = Radius - Radius / Math.Tan(AAA);
73                 ell.Segments.Add(new LineSegment { Point = p4 });
74             }
75         }
76 
77         public static void Draw(double per, PathFigure ell)
78         {
79             Draw(per, ell, ELLIPSERADIUS);
80         }
81     }
View Code

调用方法:

DrawPartOfEllipseService.Draw(80, Ell1);/*80就是百分比,Ell1是上面的xaml中的Ellipse.Clip中PathGeometry的PathFigure*/

OK,就这么多。

当然,颜色可以随意调整,至于标百分比,按自己的需求,想标哪儿标哪儿吧,还有,别忘了图例。

个人感觉,这样做速度应该比较快。

原文地址:https://www.cnblogs.com/panbao/p/3479010.html