隨筆-31  評論-257  文章-0  trackbacks-0
          本篇接著上一篇文章,上篇文章中,大家都看到最終效果了,這個例子很簡單,我就粗略的講解一下代碼吧
          整個Flex程序,就兩個Panel面板,將控件都排放好到Panel里面,之后定好相應的屬性,我主要解析一下下面的代碼:
           1 <mx:Script>
           2         <![CDATA[
           3         //導入需要用到的類
           4         import mx.utils.Base64Encoder;
           5         import mx.collections.ArrayCollection;
           6         import mx.controls.Alert;
           7         import com.adobe.images.PNGEncoder;
           8        
           9         //這里定義一個ArrayCollection 這就是PieChart控件所需要的dataProvider,并賦好初值
          10         [Bindable]
          11         private var mydata:ArrayCollection = new ArrayCollection([
          12             {name: "非常滿意",num: 1},
          13             {name: "滿意",num: 1},
          14             {name: "普通",num: 1},
          15             {name: "不滿意",num: 1},
          16             {name: "非常不滿意",num: 1}
          17         ]);
          18        
          19         //方法為PieChart控件自動調用的,是用于當圖表要顯示Label時,將會調用該方法,并傳上相應的參數,這樣,你就可以在該方法里自已處理好要顯示的數據,再返回給Chart顯示
          20         private function showLabel(data:Object, field:String, index:Number, percentValue:Number):String{
          21             return data.name + ":" + data.num + "\n" + Math.round(percentValue) + "%";
          22         }
          23        
          24         //該方法是當點擊“確定”按鈕時調用的,用于改變圖表數據的ArrayCollection里的數據,再更新圖表顯示
          25         private function changeData(ent:Event):void{
          26             //定一個臨時的集合用于放置數據
          27             var temp:ArrayCollection = new ArrayCollection();
          28             //判斷用戶所填的數據是否為空,如果為空的就不要加進集合里了,免得圖表出現一些無謂的Label,下同
          29             if(resu0.text != ""){
          30                 temp.addItem({name: "非常滿意",num: resu0.text});
          31             }
          32             if(resu1.text != ""){
          33                 temp.addItem({name: "滿意",num: resu1.text});
          34             }
          35             if(resu2.text != ""){
          36                 temp.addItem({name: "普通",num: resu2.text});
          37             }
          38             if(resu3.text != ""){
          39                 temp.addItem({name: "不滿意",num: resu3.text});
          40             }
          41             if(resu4.text != ""){
          42                 temp.addItem({name: "非常不滿意",num: resu4.text});
          43             }
          44             panel1.title = subjectTitle.text;
          45             /*
          46             mydata[0].num = resu0.text;
          47             mydata[1].num = resu1.text;
          48             mydata[2].num = resu2.text;
          49             mydata[3].num = resu3.text;
          50             mydata[4].num = resu4.text;
          51             */
          52             pc.dataProvider = temp;
          53         }
          54        
          55         //這里是截圖的方法函數,參照于國外某高手地Flex截圖方面的代碼
          56         private function catchPic(ent:Event):void{
          57             //根據要截圖的Panel的大小建立一個放置位圖數據的BitmapData對象
          58             var bitmapData:BitmapData = new BitmapData(panel1.width,panel1.height,true,0xffffff);
          59             //用現時panel1對象的位圖信息填充到bitmapData對象中
          60             //由于每一個DisplayObject對象都有自已的用于顯示的位圖色彩信息,
          61             //所以很多繼承了DisplayObject的類都可以填充到bitmapData對象中處理,如模糊處理等
          62             bitmapData.draw(panel1);
          63             //用PNGEncoder類對位圖信息進行壓縮轉換處理才得以輸出PNG圖片格式數據
          64             var bytes:ByteArray = PNGEncoder.encode(bitmapData);
          65             //再將數據進行編碼,用于在JavaScript中向瀏覽器傳播
          66             //最后調用JavaScript來打開新窗口來顯示圖借數據
          67             var b64encoder:Base64Encoder = new Base64Encoder();
          68             b64encoder.encodeBytes(bytes);
          69             ExternalInterface.call("showPic",b64encoder.flush(),panel1.width+25,panel1.height+25);
          70         }
          71         ]]>
          72 </mx:Script>


          JavaScript方面要寫上以下函數:

          1 function showPic(img,width,height){
          2     window.open("data:image/png;base64," + img,"","width="+width+",height="+height+",resizable=1");
          3 }



          以上有幾點應該要注意:
          注意PieChart的dataProvider的寫法,也就是ArrayCollection的寫法,這與很多控件的dataProvider的都一樣,比如DataGrid控件。
          注意,PNGEncoder類不是Flex原本自帶的,是要另外自已下載的擴展包,在com.adobe.images里面,是Adobe發布的核心擴展類庫,更多的類庫,大家可以在網上找找。

          以下放出完整的源代碼:[down=attachments/month_0710/92007102323188.rar]點擊下載此文件[/down]


          posted on 2008-07-29 14:10 姜大叔 閱讀(2774) 評論(4)  編輯  收藏 所屬分類: Flash/Flex

          評論:
          # re: [續] 初玩 Flex Chart,簡單實例分析![未登錄] 2008-10-09 16:42 |
          不錯,但為何怎么不見你的源碼的連接呀!!!
          wwj256@163.com望樓主發份給我,謝啦!  回復  更多評論
            
          # re: [續] 初玩 Flex Chart,簡單實例分析![未登錄] 2008-12-22 14:07 |
          怎么不能下載源碼?
          saint1107@163.com望樓主發份給我,謝謝哈  回復  更多評論
            
          # re: [續] 初玩 Flex Chart,簡單實例分析! 2009-05-22 13:39 | very good!
          望樓主發份給我(wangshigeyao@yahoo.com.cn),謝謝哈  回復  更多評論
            
          # ok[未登錄] 2010-01-20 16:00 | ok
          ok  回復  更多評論
            
          主站蜘蛛池模板: 铁力市| 汝州市| 体育| 晋江市| 呼和浩特市| 玉屏| 历史| 绥德县| 开化县| 鹰潭市| 新平| 兴文县| 泗洪县| 本溪| 苍溪县| 高青县| 呼和浩特市| 新闻| 合江县| 丰宁| 石台县| 泸西县| 太保市| 南丰县| 甘孜县| 鹿泉市| 六安市| 保康县| 南部县| 乌拉特前旗| 乳源| 油尖旺区| 栖霞市| 南城县| 永定县| 庆元县| 胶州市| 龙江县| 潞西市| 四会市| 晴隆县|