Hi I have a requirement wherein , I should be able to see a flex chart in a JSP page . Once it is rendered , without any user intervention it should send up a bitmap image .
Now one problem that I am facing is that since there is a whole lot of action script , it takes time to render it in the browser . How do I come to know if the chart is completely loaded in a browser . Once it is loaded in the browser , i can send a request back to the javascript / JSP and then initiate the bitmap generation , else the bitmap generation comes blank. I did come across Loaderinfo , does it work ? Is it the right solution ? Using a UMCainghorm framework . Sample code <?xml version="1.0"?> <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; xmlns:control="com.symphonyrpm.applayer.chart.control.*" xmlns:business="com.symphonyrpm.applayer.chart.business.*" xmlns:view="com.symphonyrpm.applayer.chart.view.*" creationComplete="creationCompleteHandler()" layout="absolute" verticalScrollPolicy="off" horizontalScrollPolicy="off" > <!-- <mx:Style> @font-face { src: local("Arial"); font-family: EmbeddedArial; } ColumnChart { font-family: EmbeddedArial; } </mx:Style>--> <mx:Script> <![CDATA[ import mx.events.DividerEvent; import mx.events.ResizeEvent; import mx.events.FlexEvent; import com.symphonyrpm.applayer.chart.controls.DragDropPanel; import com.symphonyrpm.applayer.chart.controls.chartPods.PieChartPod; import mx.core.Container; import mx.controls.Label; import mx.containers.VBox; import mx.containers.Canvas; import mx.core.DragSource; import mx.managers.DragManager; import com.symphonyrpm.applayer.chart.controls.SuperPanel; import mx.containers.Panel; import mx.core.IToolTip; import mx.containers.HBox; import mx.events.DragEvent; import mx.containers.dividedBoxClasses.BoxDivider; import mx.containers.Box; import mx.containers.HDividedBox; import mx.containers.VDividedBox; import com.symphonyrpm.applayer.chart.controls.ChartContainer; import com.symphonyrpm.applayer.chart.view.ChartHolder; import mx.collections.ArrayCollection; import mx.controls.Alert; import com.symphonyrpm.applayer.chart.events.ReportEvent; import com.universalmind.cairngorm.events.Callbacks; import com.symphonyrpm.applayer.chart.model.ModelLocator; private var _modelLocator:ModelLocator = ModelLocator.getInstance (); public var legendPanel:DragDropPanel; public var legendPanelArray:Array; public function creationCompleteHandler():void{ var handlers:Callbacks = new Callbacks (onResult_getReport,onFault); var reportEvent:ReportEvent = new ReportEvent (ReportEvent.GET_REPORT,handlers); reportEvent.data = "SalesReport"; reportEvent.dispatch(); } [Bindable] private var chartType:ArrayCollection = new ArrayCollection(); [Bindable] private var chartData:ArrayCollection = new ArrayCollection(); [Bindable] private var chartConfigData:ArrayCollection = new ArrayCollection (); private function mouseUp_Handler(event:DragEvent):void{ Alert.show("down"); } public var xOff:Number; public var yOff:Number; private function onResult_getReport(event:*):void{ var chartsArray:ArrayCollection = new ArrayCollection(); var layoutXML:XML = new XML (_modelLocator.currentReport.layoutData.Rows); for each(var chartConfig:Object in _modelLocator.currentReport.chartConfigData){ chartConfigData.addItem(XML(chartConfig)); } for each(var reportData:Object in _modelLocator.currentReport.chartData){ chartData.addItem(XML(reportData)); } for(var i:int = 0; i<chartData.length; i++){ var chartHolder:ChartHolder = new ChartHolder(); //chartHolder.chartType = chartType.getItemAt(i) as String; chartHolder.chartID = XML(chartData.getItemAt(i))....@id.tostring (); chartHolder.chartConfigData = chartConfigData.getItemAt(i) as XML; chartHolder.chartData = chartData.getItemAt(i) as XML; chartHolder.percentHeight = 100; chartHolder.percentWidth = 100; chartsArray.addItem(chartHolder); //addChild(chartHolder); } var chartIndex:int = 0; legendPanelArray = new Array(); for(var i:int = 0; i<layoutXML.Row.length();i++){ var row:XML = layoutXML.Row[i]; var length:int = row.Cell.length(); //aAlert.show("OuterBox Height:->"+OuterBox.height +" : "+OuterBox.explicitWidth); if(length> 1){ var hbox:HDividedBox = new HDividedBox(); hbox.percentWidth=100; hbox.setStyle("horizontalGap","30"); hbox.setStyle("dividerColor","red"); OuterBox.addChild(hbox); for(var j:int = 0; j<row.Cell.length();j++){ var cell:XML = row.Cell[j]; var canvas:Canvas = new Canvas(); canvas.addChild(ChartHolder (chartsArray.getItemAt(chartIndex))); legendPanel = new DragDropPanel(); legendPanel.addEventListener (MouseEvent.MOUSE_MOVE,mouseMoveHandler); legendPanel.styleName = "legendSkin"; legendPanel.title = "Legend"; legendPanel.setStyle("paddingLeft",10); legendPanel.setStyle("paddingRight",10); legendPanel.setStyle("paddingTop",25); legendPanel.setStyle("paddingBottom",10); legendPanel.maxHeight = 300; legendPanel.width = 200; legendPanel.rowIndex = i; legendPanel.colIndex = j; legendPanel.id = ChartHolder (chartsArray.getItemAt(chartIndex)).chartID; legendPanel.name = legendPanel.id ; if (ChartHolder(chartsArray.getItemAt (chartIndex)).chartconfigda...@type.tostring() == "PieChart"){ addChild(legendPanel); legendPanelArray.push(legendPanel); PieChartPod(ChartContainer(ChartHolder (chartsArray.getItemAt(chartIndex)).getChildAt(0)).getChildAt (0)).setCustomLegend(); } hbox.addChild(canvas); //hbox.setChildIndex(canvas,numChildren -1); var percHgt:int = ce...@height * 100; var percWdt:int = ce...@width * 100; Canvas(hbox.getChildAt(j)).percentWidth = percWdt; Canvas(hbox.getChildAt(j)).percentHeight = 100; //Alert.show(percHgt+" :PERC"); hbox.percentHeight = 50; chartIndex++; var pt:Point = new Point(0, 0); canvas.addEventListener(ResizeEvent.RESIZE, resizeHandler); } }else{ var cell1:XML = row.Cell[0]; var canvas:Canvas = new Canvas(); var chart:ChartHolder = ChartHolder (chartsArray.getItemAt(chartIndex++)); canvas.addChild(chart); OuterBox.addChild(canvas); var percHgt1:int = cel...@height * 100; var percWdt1:int = cel...@width * 100; //Alert.show(percHgt1+" :PERC"); canvas.percentWidth = percWdt1; canvas.percentHeight = percHgt1; } } addEventListener(ResizeEvent.RESIZE, resizeHandler); var ldr:Loader = new Loader(); ldr.contentLoaderInfo.addEventListener(Event.COMPLETE, loaded); addChild(ldr); } private function onFault(event:*):void{ trace(event); Alert.show("Error in getting the Report Data"); } private function mouseMoveHandler(event:MouseEvent):void { var dragInitiator:Panel=Panel(event.currentTarget); var ds:DragSource = new DragSource(); ds.addData(dragInitiator, "panel"); DragManager.doDrag(dragInitiator, ds, event); } private function resizeHandler(event:Event):void{ for each(var legendPanelItem:DragDropPanel in legendPanelArray) { legendPanelItem.dispatchEvent(new MouseEvent (MouseEvent.DOUBLE_CLICK,true,false)); } } ]]> </mx:Script> <mx:Style source="/css/Globals.css"/> <control:ChartController id="chartcontroller"/> <business:Services id="services"/> <mx:VDividedBox id="OuterBox" width="100%" height="100%" verticalGap="30" dividerColor="red" > </mx:VDividedBox> </mx:Application> --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Flex India Community" group. To post to this group, send email to flex_india@googlegroups.com To unsubscribe from this group, send email to flex_india+unsubscr...@googlegroups.com For more options, visit this group at http://groups.google.com/group/flex_india?hl=en -~----------~----~----~----~------~----~------~--~---
