DataGrid 与chart联动Step By Step 2

还有一个头痛很久的鼠标触发问题,后来发现可以用<textarea cols="50" rows="15" name="code" class="c-sharp"> myChart.showDataTips = false; myChart.showDataTips = true;</textarea>

来实现无鼠标下显示datatip,同时showDataTips="true"

<textarea cols="50" rows="15" name="code" class="java">&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt; &lt;mx:Canvas xmlns:mx=&quot;http://www.adobe.com/2006/mxml&quot; xmlns:report=&quot;dps.component.report.*&quot; xmlns:chart=&quot;dps.component.chart.*&quot; creationComplete=&quot;init()&quot; &gt; &lt;mx:Script&gt; &lt;!--[CDATA[ import mx.charts.events.ChartItemEvent; import mx.events.ListEvent; import dps.model.PaperJamResultBean; import dps.model.LocationEntityBean; import dps.model.ResponseTimeResultBean; import dps.model.ResponseTimeReportBean; import dps.core.util.DateUtil; import mx.charts.HitData; import dps.model.RoleEntityBean; import mx.events.DynamicEvent; import mx.collections.ArrayCollection; import mx.controls.Alert; import mx.charts.chartClasses.IAxis; import mx.utils.ObjectUtil; import dps.control.ReportControl; import dps.control.ManagementControl; [Bindable]public var printerAdmin:RoleEntityBean; [Bindable]public var printerAdminList:ArrayCollection; [Bindable]public var paList:ArrayCollection = new ArrayCollection(); public var loginUser:RoleEntityBean; [Bindable]private var responseAC:ArrayCollection = new ArrayCollection(); [Bindable]private var responseAC1:ArrayCollection = new ArrayCollection(); [Bindable] public var timeFrom:String; [Bindable] public var timeTo:String; [Bindable] public var tenantUID:String; [Bindable] public var userId:int; public var flag:Boolean=true; public function init():void { timeFrom = filterBar.lblfrom.text; timeTo = filterBar.lblto.text; tenantUID = &quot;T1&quot; loginUser = ReportModule.loginUser; filterBar.addEventListener(&quot;printerAdminSelected&quot;,printerAdminSelected); filterBar.addEventListener(&quot;PeriodFilter&quot;,periodClick); filterBar.addEventListener(&quot;SiteFilter&quot;,locationSelected); } public function getAdminList():void { ManagementControl.getInstance().getAllPrinterAdmin(ReportModule.loginUser.tenantUID,callback); function callback(admins:ArrayCollection,reset:Boolean = true):void { printerAdminList = admins; locatinFilter(filterBar.buildingSelector.selectedItem.displayName); } } public function getResponseTime():void { if(responseAC) { responseAC.removeAll(); } ReportControl.getInstance().getResponseTimeReport(timeFrom,timeTo,tenantUID,userId,callback); function callback(responseTimeReportBean:ResponseTimeReportBean):void { responseAC = responseTimeReportBean.resultList ; average.text = &quot;Average :&quot;+responseTimeReportBean.avgValue + &quot;minutes &quot;; } } public function printerAdminSelected(evt:DynamicEvent):void { printerAdmin = evt.data; tenantUID = &quot;T1&quot;;//printerAdmin.tenantUID; userId = printerAdmin.id; responsePanel.title = &quot;Printer Admin : &quot;+ printerAdmin.employee.name; getResponseTime(); } public function locationSelected(evt:DynamicEvent):void { if(!flag) { locatinFilter(filterBar.buildingSelector.selectedItem.displayName); } if(flag) { getAdminList(); flag = false; } } private function locatinFilter(locationName:String):void { if(paList) { paList.removeAll(); } for(var i:int;i&lt;printerAdminList.length;i++) { var padminSelected:RoleEntityBean = printerAdminList[i] as RoleEntityBean; for each(var o:LocationEntityBean in padminSelected.chargedLocations) { for each(var ob:LocationEntityBean in o.childLocations) { //Alert.show(ob.displayName); if(locationName==ob.displayName) { //Alert.show(padminSelected.employee.notesId); paList.addItem(padminSelected); } } } filterBar.printerAdminList = paList; } if(paList.length&gt;0) { userId = paList[0].id; responsePanel.title = &quot;Printer Admin : &quot;+ paList[0].employee.name; getResponseTime(); } } private function linearAxis_labelFunc(item:Object, prevValue:Object, axis:IAxis):String { return item.toString(); } private function categoryAxis_labelFunc(item:Object, prevValue:Object, axis:CategoryAxis, categoryItem:Object):String { return null; } private function dataTipFunction(item:HitData):String { // return null return &quot;Printer Name:&quot;+item.chartItem.item.printer.name+&quot;&amp;#13;&quot;+&quot;&amp;#13;&quot;+&quot;Paper Jam: &quot;+DateUtil.toString(item.chartItem.item.updateTime)+&quot;&amp;#13;&quot;+&quot;&amp;#13;&quot;+&quot;Ready: &quot;+DateUtil.toString(item.chartItem.item.recoverTime)+&quot;&amp;#13;&quot;+&quot;&amp;#13;&quot;+&quot;Response Time: &quot;+item.chartItem.item.reponseTime+&quot; Minutes&quot;; } private function labelFunction(item:Object, column:DataGridColumn):String { if((item as ResponseTimeResultBean).updateTime!=null){ return DateUtil.toMinuteString((item as ResponseTimeResultBean).updateTime); }else{ return &quot;&quot;; } } private function labelFunction2(item:Object, column:DataGridColumn):String { if((item as ResponseTimeResultBean).recoverTime!=null){ return DateUtil.toMinuteString((item as ResponseTimeResultBean).recoverTime); }else{ return &quot;&quot;; } } public function periodClick(evt:DynamicEvent):void { timeFrom = evt.timeFrom; timeTo = evt.timeTo; getResponseTime(); } public function sortCompareFunction(itemA:Object, itemB:Object):int { var dateA:String = itemA.printer.name; var dateB:String = itemB.printer.name; return ObjectUtil.stringCompare(dateA, dateB); } public function itemClick(event:ListEvent):void { /*var printer:PaperJamResultBean = dataGrid.selectedItem as PaperJamResultBean; Alert.show(printer.printerUid); /*var dymEvent:DynamicEvent = new DynamicEvent(&quot;selectPrinter&quot;); dymEvent.data = printer; dispatchEvent(dymEvent);*/ /*trace(&quot;lblhour&quot;+lblhour.x); trace(&quot;myChart&quot;+myChart.x);*/ myChart.k = event.rowIndex; myChart.showDataTips = false; myChart.showDataTips = true; } public function myHandler(e:ChartItemEvent):void { trace(e); Alert.show(&quot;Chart data was clicked&quot;); } ]]--&gt; &lt;/mx:Script&gt; &lt;mx:Panel width=&quot;100%&quot; height=&quot;100%&quot; headerHeight=&quot;35&quot; title=&quot;Response Time&quot;&gt; &lt;mx:HBox width=&quot;100%&quot; height=&quot;100%&quot;&gt; &lt;mx:VBox width=&quot;35%&quot; height=&quot;100%&quot;&gt; &lt;mx:DataGrid dataProvider=&quot;{responseAC}&quot; id=&quot;dataGrid&quot; width=&quot;100%&quot; height=&quot;100%&quot; itemClick=&quot;itemClick(event)&quot;&gt; &lt;mx:columns&gt; &lt;mx:DataGridColumn headerText=&quot;Printer Name&quot; sortCompareFunction=&quot;sortCompareFunction&quot;&gt; &lt;mx:itemRenderer&gt; &lt;mx:Component&gt; &lt;mx:Label text=&quot;{data.printer.name}&quot;/&gt; &lt;/mx:Component&gt; &lt;/mx:itemRenderer&gt; &lt;/mx:DataGridColumn&gt; &lt;mx:DataGridColumn headerText=&quot;Paper Jam&quot; labelFunction=&quot;labelFunction&quot; sortable=&quot;false&quot;&gt; &lt;/mx:DataGridColumn&gt; &lt;mx:DataGridColumn headerText=&quot;Reday&quot; labelFunction=&quot;labelFunction2&quot; sortable=&quot;false&quot;&gt; &lt;/mx:DataGridColumn&gt; &lt;mx:DataGridColumn headerText=&quot;Response Time&quot; dataField=&quot;reponseTime&quot;&gt; &lt;/mx:DataGridColumn&gt; &lt;/mx:columns&gt; &lt;/mx:DataGrid&gt; &lt;/mx:VBox&gt; &lt;mx:Panel height=&quot;100%&quot; width=&quot;65%&quot; layout=&quot;absolute&quot; headerHeight=&quot;0&quot;&gt; &lt;mx:Panel height=&quot;100%&quot; width=&quot;100%&quot; title=&quot;Response Time&quot; id=&quot;responsePanel&quot;&gt; &lt;mx:HBox width=&quot;100%&quot;&gt; &lt;mx:Label id=&quot;lblhour&quot; text=&quot; Hour(s)&quot; fontWeight=&quot;bold&quot;/&gt; &lt;mx:Spacer width=&quot;100%&quot;/&gt; &lt;mx:Label id=&quot;average&quot; fontWeight=&quot;bold&quot;/&gt; &lt;/mx:HBox&gt; &lt;!--&lt;mx:ColumnChart id=&quot;column&quot; height=&quot;100%&quot; width=&quot;100%&quot; paddingLeft=&quot;5&quot; paddingRight=&quot;5&quot; color=&quot;0x323232&quot; showDataTips=&quot;true&quot; dataProvider=&quot;{responseAC}&quot; dataTipFunction=&quot;dataTipFunction&quot; maxColumnWidth=&quot;10&quot; itemClick=&quot;myHandler(event)&quot;&gt; &lt;mx:verticalAxis&gt; &lt;mx:LinearAxis labelFunction=&quot;linearAxis_labelFunc&quot; /&gt; &lt;/mx:verticalAxis&gt; &lt;mx:horizontalAxis&gt; &lt;mx:CategoryAxis categoryField=&quot;printerUID&quot; labelFunction=&quot;categoryAxis_labelFunc&quot;/&gt; &lt;/mx:horizontalAxis&gt; &lt;mx:series&gt; &lt;mx:ColumnSeries yField=&quot;reponseTime&quot; displayName=&quot;paper jam times&quot; width=&quot;0.1&quot;/&gt; &lt;/mx:series&gt; &lt;mx:secondVerticalAxis&gt; &lt;mx:LinearAxis/&gt; &lt;/mx:secondVerticalAxis&gt; &lt;mx:secondSeries&gt; &lt;mx:LineSeries yField=&quot;av&quot; dataProvider=&quot;{responseAC}&quot;/&gt; &lt;/mx:secondSeries&gt; &lt;/mx:ColumnChart&gt; --&gt; &lt;mx:VBox width=&quot;100%&quot; height=&quot;100%&quot;&gt; &lt;chart:MyColumnChart width=&quot;100%&quot; height=&quot;100%&quot; id=&quot;myChart&quot; dataProvider=&quot;{responseAC}&quot; showDataTips=&quot;true&quot; dataTipFunction=&quot;dataTipFunction&quot;&gt; &lt;chart:series&gt; &lt;chart:MyColumnSeries id=&quot;xuhua&quot; yField=&quot;reponseTime&quot; /&gt; &lt;/chart:series&gt; &lt;chart:horizontalAxis&gt; &lt;mx:CategoryAxis categoryField=&quot;printerUID&quot; labelFunction=&quot;categoryAxis_labelFunc&quot;/&gt; &lt;/chart:horizontalAxis&gt; &lt;/chart:MyColumnChart&gt; &lt;/mx:VBox&gt; &lt;/mx:Panel&gt; &lt;/mx:Panel&gt; &lt;/mx:HBox&gt; &lt;/mx:Panel&gt; &lt;report:FilterResponse id=&quot;filterBar&quot; width=&quot;100%&quot; cornerRadius=&quot;5&quot; borderStyle=&quot;solid&quot; /&gt; &lt;/mx:Canvas&gt; </textarea>

有一个Bug就是由于包含父容器,x,y坐标都不正确,原本打算用var pt:Point = localToGlobal (new Point(items[k].x,items[k].y));发现效果很差

我是在硬代码中微调的,可能留下隐患

var pt:Point = new Point(items[k].x+50,items[k].y+10);

这样就初步实现了联动

你可能感兴趣的:(DataGrid 与chart联动Step By Step 2)