看到论坛中有朋友发贴问如何把 dataGrid的数据拖拽到column chart中显示,搜了一下好像还没有类似的答案,于是写做教程,其实很简单,道理就是把dataGrid拖拽的项的data添加到column chart的dataProvider中去。当然这要求column chart能认识dataGrid的这项数据。我的例子是 DataGrid与cloumn chart解析的都是相同构造的数据源,扩展开来的话可以把dataGrid中的某几项拿出来构造新的数据项传给column chart。其他的chart道理也是一样。
Demo操作:
- 随意拖拽grid中的某一项到下面的column chart,放手,column chart显示拄状图.
- 相同数据不能重复添加。
代码里注释已经很清楚了,直接看就能明白
主要代码
//DataGrid的数据源 [Bindable] private var medalsAC:ArrayCollection = new ArrayCollection( [ { Country: "USA", Gold: 35, Silver:39, Bronze: 29 }, { Country: "China", Gold: 32, Silver:17, Bronze: 14 }, { Country: "Russia", Gold: 27, Silver:27, Bronze: 38 } ]); //ColumnChart的数据源, 默认为空 [Bindable] private var chartData:ArrayCollection = new ArrayCollection() private function init():void{ //让columnChart监听拖拽事件 column.addEventListener(DragEvent.DRAG_ENTER,dragEnterHandle) column.addEventListener(DragEvent.DRAG_DROP,dragdropHandle) } //因为只有DataGrid推拽,所以直接允许,如果界面上有多个控件监听拖拽事件,需要判断后允许正确的数据进入 private function dragEnterHandle(e:DragEvent):void{ DragManager.acceptDragDrop(e.currentTarget as UIComponent) } //拖拽放开后处理 private function dragdropHandle(e:DragEvent):void{ //如果Column Chart中已经存在相同数据,报错返回 if(chartData.contains((e.dragInitiator as DataGrid).selectedItem)){ Alert.show("数据已经存在"); return; } //往column chart的dataprovider中添加拖拽数据。 //如果只需要特定的数据进入column chart,可以先做数据筛选。 chartData.addItem((e.dragInitiator as DataGrid).selectedItem) } |

怎么源码下载不了啊 。。。能给我一份吗? 发到我邮箱可以吗?
Reply
谢谢提醒,改了目录位置忘了跟新链接,现在好了
Reply
Oh, its great!
Reply
真好,谢谢
Reply
无数据时,0边上的那个很短的白线没法去掉噢?
Reply
thanks, helpful
Reply
thanks
Reply
使命的下载…….谢谢楼主的好东西…..学习了….
Reply
你好,我也是源码下载不了…
可以发份到我邮箱里吗.. 谢谢 ..
Reply