Tim, You're right! It does seem to make a difference how the series object is instantiated. Odd.
I was headed down the path of creating the whole chart chart in AS. Thanks for saving me from that/ On Thu, Apr 23, 2009 at 3:50 PM, Tim Hoff <[email protected]> wrote: > > > And if you wanted to make it truly dynamic: > > *private* *function* createChartSeries(event:Event):*void* > { > * var* chartSeries:Array = *new* Array(); > * var* i:int; > > * for* (i = 0; i < chartData.length; i++) > { > * var* series:ColumnSeries = *new* ColumnSeries(); > series.xField = *"category"*; > series.yField = *"val"* + (i+1).toString(); > series.displayName = *"Series "*+ (i+1).toString(); > > chartSeries.push( series ); > } > > columnChart.series = chartSeries; > } > > -TH > > --- In [email protected], Richard Rodseth <rrods...@...> wrote: > > > > Here's some sample code illustrating the problem, though in this version > all > > columns in a category seem to be off: > > > > <?xml version="1.0" encoding="utf-8"?> > > <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"; > layout="vertical"> > > > > <mx:Script> > > <![CDATA[ > > private function onTwoSeries(event:Event):void { > > columnChart.series = [ a, b ]; > > } > > private function onThreeSeries(event:Event):void { > > columnChart.series = [ a, b, c ]; > > } > > > > [Bindable] > > public var chartData:Array = [ { category:"cat1", val1:100, > > val2:100, val3:100 }, > > { category:"cat2", val1:100, > > val2:100, val3:100 }, > > { category:"cat3", val1:100, > > val2:100, val3:100 } > > ]; > > ]]> > > </mx:Script> > > > > <mx:Button label="2 Series" click="onTwoSeries(event)"/> > > <mx:Button label="3 Series" click="onThreeSeries(event)"/> > > > > <mx:ColumnSeries id="a" > > xField="category" > > yField="val1" > > displayName="Series a" > > /> > > <mx:ColumnSeries id="b" > > xField="category" > > yField="val2" > > displayName="Series b" > > /> > > <mx:ColumnSeries id="c" > > xField="category" > > yField="val3" > > displayName="Series c" > > /> > > > > > > <mx:ColumnChart id="columnChart" type="stacked" > > dataProvider="{this.chartData}" width="100%" height="100%"> > > > > <mx:horizontalAxis> > > <mx:CategoryAxis categoryField="category" > > dataProvider="{this.chartData}"/> > > </mx:horizontalAxis> > > <mx:series> > > <mx:ColumnSeries > > xField="category" > > yField="val1" > > displayName="Series a" > > /> > > > > </mx:series> > > > > </mx:ColumnChart> > > </mx:Application> > > > > > > > > On Thu, Apr 23, 2009 at 1:26 PM, Richard Rodseth rrods...@... wrote: > > > > > It looks like a stack of blocks where each one is shifted over a bit > from > > > the one below. > > > > > > > > > On Thu, Apr 23, 2009 at 1:16 PM, Maciek Sakrejda [email protected]: > > > > > >> > > >> > > >> What do you mean by "aligned with each other"? > > >> > > >> > > >> -----Original Message----- > > >> From: Richard Rodseth rrods...@... <rrodseth%40gmail.com>> > > >> Reply-to: [email protected] <flexcoders%40yahoogroups.com> > > >> To: [email protected] <flexcoders%40yahoogroups.com> > > >> Subject: Re: [flexcoders] Dynamic Flex Stacked Column Chart > > >> Date: Thu, 23 Apr 2009 13:13:51 -0700 > > >> > > >> Trying one more time. Surely there's a call (validateNow() ?, > > >> invalidateDisplayList() ? that would force a column chart to display > > >> properly after its series array has been dynamically constructed? > > >> > > >> I haven't been able to find a JIRA bug though this may be related: > > >> > > >> http://bugs.adobe.com/jira/browse/FLEXDMV-1957 > > >> > > >> On Wed, Apr 15, 2009 at 1:23 PM, Richard Rodseth rrodseth@ > ...<rrodseth%40gmail.com> > > >> > > > >> wrote: > > >> Did you have any luck with this? > > >> > > >> I have a binding function as follows > > >> > > >> <mx:ColumnChart id="columnChart" type="stacked" > > >> height="100%" > > >> width="100%" > > >> dataProvider="model.chartData" > > >> series="{this.buildSeriesList(model.seriesSpec)}" > > >> > > >> and the stacked columns are displayed, but not aligned with each > > >> other. Quite amusing, except when you have a deadline. > > >> This must be the known defect you referred to. > > >> Anyone know a workaround, or defect number? > > >> > > >> > > >> > > >> > > >> On Mon, Apr 6, 2009 at 9:20 AM, jeffreyr6915 > > >> jrwalk...@... <jrwalker2%40gmail.com>> wrote: > > >> I'd like to create a dynamic Flex Stacked Column Chart > > >> at runtime, based on values out of a database. The > > >> following are the steps that I currently follow (without > > >> success): > > >> > > >> 1. Query the database and populate chartIemArrayColl > > >> with ChartItem objects > > >> 2. Iterate through chartIemArrayColl and only create a a > > >> new columnseries object if there does not already exist > > >> on for that 'selection'. Add this columnseries to the > > >> columnset > > >> 3. Apply this to the chart > > >> > > >> Note: I used secondSeries instead of series because of a > > >> known defect in Flex that makes the charts off center if > > >> series is used. > > >> > > >> Problems: > > >> ------------ > > >> 1. The chartIemArrayColl contains items that contain the > > >> same 'name' but different 'value' and different > > >> 'selection'. However, in this case that particular > > >> 'name' is printed on the x-axis multiple times (not > > >> correct) > > >> 2. The 'selection' should be the legend, but when it is > > >> graphed it does not seem as though it is connected to > > >> the items actually charted > > >> > > >> What I'd like to achieve: > > >> ---------------------------- > > >> 1. Column chart with a legend that contains only values > > >> of the 'selection' > > >> 2. Stacked Column chart that contains values where I can > > >> chart the following example: > > >> > > >> item1 (name="myName", selection="sel1", value=4) > > >> item2 (name="myName", selection="sel2", value=6) > > >> item3 (name="name3", selection="sel1", value=8) > > >> > > >> I expect a chart that has myName and name3 across the > > >> x-axis (myName should only appear once). A column should > > >> appear at myName that has one color/selection (value 4) > > >> stacked on top of another (value 6). A column should be > > >> at name3 with the same color/selection as item1 (value > > >> 8). > > >> > > >> Can you please help me with this? Thanks so much in > > >> advance > > >> > > >> ChartItem.as > > >> ------------------- > > >> > > >> package com.dashboard.teamtrack.util > > >> { > > >> public class ChartItem > > >> { > > >> public var name:String; > > >> public var selection:String; > > >> public var value:int; > > >> > > >> public function ChartItem() > > >> { > > >> } > > >> } > > >> } > > >> > > >> Main.mxml > > >> ----------------------- > > >> for each(var currChartItem:ChartItem in > > >> chartIemArrayColl ) > > >> { > > >> if(!selectionArr.contains(currChartItem.selection)) > > >> { > > >> selectionArr.addItem(currChartItem.selection); > > >> var columnSeries:ColumnSeries = new ColumnSeries(); > > >> > > >> columnSeries.setStyle("itemRenderer", new > > >> ClassFactory(com.dashboard.itemrenderers.TriDiRenderer)); > > >> > > >> columnSeries.displayName = currChartItem.selection; > > >> columnSeries.yField = 'value'; > > >> columnSeries.xField = 'name'; > > >> columnSeries.dataProvider = chartIemArrayColl ; > > >> columnSet.series.push(columnSeries); > > >> > > >> } > > >> } > > >> > > >> columnSet.type = "stacked"; > > >> chart.secondSeries.push(columnSet); > > >> chart.invalidateSeriesStyles(); > > >> chart.secondSeries = chart.secondSeries; > > >> > > >> //<More code here> > > >> > > >> > > >> <mx:ColumnChart id="chart" height="100%" width="100%" > > >> fontSize="9" fontWeight="bold" color="#010000" > > >> showDataTips="true" clipContent="false" x="0" y="27"> > > >> > > >> <mx:verticalAxis> > > >> <mx:LinearAxis title="Open Count Total" /> > > >> </mx:verticalAxis> > > >> > > >> <mx:horizontalAxisRenderers> > > >> <itemrenderers:TriDiAxisRenderer > > >> axis="{myHorizontalAxis}" placement="bottom"/> > > >> </mx:horizontalAxisRenderers> > > >> <mx:horizontalAxis> > > >> <mx:CategoryAxis id="myHorizontalAxis" > > >> dataProvider="{chartIemArrayColl}" > > >> categoryField="name"/> > > >> </mx:horizontalAxis> > > >> </mx:ColumnChart> > > >> <mx:Legend id="openDefectChartLegend" > > >> dataProvider="{chart}" fontSize="9" fontWeight="bold" > > >> color="#010000" width="100%" height="64"/> > > >> > > >> > > >> > > >> > > >> > > >> > > >> > > >> > > >> > > >> > > > > > > > > > >
