2 Replies Latest reply on Jan 12, 2007 9:26 AM by Rob Pomerleau

    dynamic pie chart generation


      I am new to flex.But I have this requirement where i need to read from xml file and display data in a datagrid.Upto this point it is ok done .the next part is that as i move on different rows in datagrid i need to draw a pie chart for that row.So as the row changes pie chart should change dynamically to reflect the row change.
      No idea how to do it.????
      Can any one please help me with this.
      Thanks in advance
        • 1. Re: dynamic pie chart generation
          FlightGuy Level 1
          Rather a broad question, but in a nutshell you'll need to create your pie-chart, and bind the dataProvider to the selectedItem in the datagrid.

          Something like this:
          <mx:DataGrid id="myDataGrid" .../>
          <mx:PieChard dataProvider="{myDataGrid.selectedItem.chartData}".../>

          the detail naturally depends on how your data is structured. If this doesn't help, post a bit more detail.

          • 2. Re: dynamic pie chart generation
            Rob Pomerleau
            I am also very new to Flex and although my need is a little bit different than that of the original posters, i think that our questions may be similar enough to not start a new topic.

            I have a datagrid populated by an array and i would like the user to be able to select the row and have the data from that row be displayed in a pie chart. Below is what i have so far, but as you can see no pie chart just yet, as i am not sure how to transfer the selected row from the datagrid to an array that the pie chart can use.

            <?xml version="1.0" encoding="utf-8"?>
            <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml"
            layout="absolute" backgroundGradientColors="[#ffffff, #ffffff]">

            import mx.collections.ArrayCollection;

            public var loading:ArrayCollection = new ArrayCollection([
            {Trial: "Load 01",Time: 57, pass1: 12, pass2: 17, pass3: 16, pass4: 12},
            {Trial: "Load 02",Time: 61, pass1: 14, pass2: 13, pass3: 15, pass4: 19},
            {Trial: "Load 03",Time: 75, pass1: 19, pass2: 16, pass3: 21, pass4: 19},
            {Trial: "Load 04",Time: 98, pass1: 23, pass2: 24, pass3: 32, pass4: 19},
            {Trial: "Load 05",Time: 65, pass1: 10, pass2: 11, pass3: 17, pass4: 27},
            {Trial: "Load 06",Time: 63, pass1: 14, pass2: 18, pass3: 17, pass4: 13},
            {Trial: "Load 07",Time: 65, pass1: 13, pass2: 15, pass3: 18, pass4: 19},
            {Trial: "Load 08",Time: 70, pass1: 17, pass2: 15, pass3: 20, pass4: 18},
            {Trial: "Load 09",Time: 80, pass1: 18, pass2: 21, pass3: 25, pass4: 16},
            {Trial: "Load 10",Time: 73, pass1: 14, pass2: 21, pass3: 17, pass4: 20} ]);


            <mx:DataGrid id="myDataGrid" width="55%" height="100%" dataProvider="{loading}">
            <mx:DataGridColumn headerText="Load" dataField="Trial"/>
            <mx:DataGridColumn headerText="Total Time" dataField="Time"/>
            <mx:DataGridColumn headerText="Pass 1" dataField="pass1"/>
            <mx:DataGridColumn headerText="Pass 2" dataField="pass2"/>
            <mx:DataGridColumn headerText="Pass 3" dataField="pass3"/>
            <mx:DataGridColumn headerText="Pass 4" dataField="pass4"/>

            I reallize this is a very basic question, but i would appreciate anyone pointing me in the right direction.