圆形分格统计图表
作者 佚名技术
来源 服务器技术
浏览
发布时间 2012-07-12
|
今天就来换点新鲜的, 也许对某些人有点帮助..... 也许bar chart很多人都会做了, 但是pie chart就挺麻烦的, 不会3D的话怎么办呢.. 在这里就教你们一个仿3D的方法做个pie chart骗吃吧 :p 这个仿3D的效果就是使用"遮照"达成, 可以看看这里的效果, 是否有兴趣继续下去  点击浏览该文件步骤1 : 首先当然是弄个3D的pie chart图片汇入到Flash中(方法很多, 最简单的方法就是使用swift 3d软件)  步骤2 : 把汇入的pie chart转换成MC组件, 然后在Library(ctrl+L)设定linkage名为pie  步骤3 : 在第一帧输入 var angleA = new Array(0, 120, 280); //这里是我自己设定的, 你们可以通过计算设定扇形的开始和结束(angleB), 这里就不用写出来了吧.. 动一下脑筋就ok var angleB = new Array(120, 280, 360); var radius = 100; //这里是你们饼图片的半径 initial(); function initial() { for (var i = 0; iattachMovie("pie", "pie"+i, i); //引用library中的pie chart _root["pie"+i]._x = 200; _root["pie"+i]._y = 200; createEmptyMovieClip("mask"+i, i+angleA.length); //因为我的例子有三个扇形所以就制做3个遮照和3个pie _root["mask"+i]._x = _root["pie"+i]._x; _root["mask"+i]._y = _root["pie"+i]._y-15; Draw(angleA[i], angleB[i], i); //开始画出所要遮照的范围 _root["pie"+i].setMask(_root["mask"+i]); //进行遮照 setHue(Math.floor(Math.random()*0xFFFFFF), i); //随机数决定三个扇形的颜色 } } function Point(Angle) { var pt = new Object(); pt.x = radius*Math.cos((Math.PI/180)*Angle); pt.y = (0.5)*radius*Math.sin((Math.PI/180)*Angle); return pt; } function Draw(angleA, angleB, depth) { _root["mask"+depth].createEmptyMovieClip("drawer", 0); with (_root["mask"+depth].drawer) { beginFill(0xFFFFFF, 30); pt1 = Point(angleA); //这里会回传弧度上"相对"(angleA)的坐标, 详细可以参考圆形的教程 lineTo(pt1.x, pt1.y); //从中心点画线到回传的坐标上 if (pt1.y<=0) { //判断此点的坐标是属于-180方向还是180方向而第一下一步需要画线的y坐标 lineTo(2*pt1.x, 2*pt1.y); } else { lineTo(pt1.x, pt1.y+50); } var tempAngle = angleA+10; while (tempAngletempPt = Point(tempAngle); lineTo(2*tempPt.x, 2*tempPt.y); tempAngle += 10; } pt2 = Point(angleB); //回传弧度结束的坐标 if (pt2.y<=0) { lineTo(2*pt2.x, 2*pt2.y); } else { lineTo(pt2.x, pt2.y+50); } lineTo(pt2.x, pt2.y); endFill(); } } function setHue(rgb, depth) { //这个上色步骤看起来虽然简单, 但却是精髓部份 c = new Color(_root["pie"+depth]); cv = rgb; r = (cv >> 16)/2; //这里接下来3步骤开始设定RGB光暗部份 g = ((cv >> 8) & (0xFF))/2; b = (cv & 0xFF)/2; c.setTransform({ra:r, ga:g, ba:b, rb:0, gb:0, bb:0, aa:100, ab:0}); //实现光暗部份, 可以参考Flash附带字典的说明 } 补充 : <<, >>, & 这三个operator可以参考Flash附带的字典... 但我会举个清楚的例子补注 在我们的世界中一些都是以10进位做为单位, 但在计算机的世界中是以2进制, 所以所有数据都是0和1 首先来看看 1, 2等数目在计算机中的2进制是 1 = 0001 2 = 0010 3 = 0011 4 = 0100 5 = 0101 6 = 0110为何我会知道0001是1呢?? 因为计算机是使用binary(二进制)计算, 是从右到左计算,0001, 从右边的0次方一直向左加 : 1的0次方 + 0的1次方 + 0的2次方 + 0的3次方 = 1 (1^0)+(0^1)+(0^2)+(0^3)=1 0110 = (0^0) + (1^1) + (1^2) + (0^3) = 0+2+4+0 |
凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢! |
你可能对下面的文章感兴趣
上一篇: 飞机游戏+跟踪导弹源码下一篇: 关于 AS2.0 的 Intrinsic 类
关于圆形分格统计图表的所有评论
