Hoodlum1980 (fafa)'s Technological Blog

Languages mainly using and digging: C / CPP, ASM, C#, Python. Other languages:Java.

博客园 首页 新随笔 联系 订阅 管理

        最近在查询移动历史话费页面上,新增加了一个小小的消费比例的饼图,就是这个小小的饼图,给我修改话费账单页面造成了一点小小的麻烦,如果我要修改账单里得金额,我必须在Photoshop中重新计算消费比例,再根据此修改出一张新的图,非常麻烦。因此我尝试完全仿照它的样式自己用代码绘制出这样一个“小圆饼”。还好的是,这个小饼比较简单,固定由三部分费用组成,详见下图所示。

      

       这个图虽然比较简单,但也存在绘制饼图的所有“麻烦”要素:

       (1)角度变换问题。饼图并不是正透视,而是倾斜视角,所以角度存在变幻关系。这里的饼图和视平线成一个倾斜夹角,因此我们简单的认为,假设以圆饼圆心为原点,圆饼边缘上的点的横坐标不变,而纵坐标y具有这样的变换关系:y'=y*k; 其中k=椭圆高度/椭圆宽度;如下图所示:

     

       因此 tg a'=k tg a, 即a'=atan( k*tg a );

       另一点需要注意的是,图上的角度以12点为起始点,因此圆饼边界射线的角度值范围从-90~270度,而反正切函数值的范围是-90~90度,反正切后需要把值重新映射到-90~270度范围。

      (2)另一个难点是绘制圆饼的侧面,也就是在视角可见的圆柱面,每一块侧面由上下两段椭圆弧+两侧两个一条垂直线段组成一个闭合路径,然后填充它即可。具体方法参见DrawPieSide方法,代码略。

       这样我们填入相应的金额,点击生成按钮即可生成一张饼图,然后点击保存按钮即可把图片保存到硬盘。

       源代码下载链接:    

       https://files.cnblogs.com/hoodlum1980/JRL_PieGraph.rar       

posted on 2008-09-23 10:38  hoodlum1980  阅读(775)  评论(0编辑  收藏  举报