stacked Bar chart/Line chart hybrid- Charting

[Bayani Portier]

Hi all,

I have a requirement to have a stacked bar graph, with a line graph on the
same chart. Has anyone here done this before? Apparently there is a known
problem with combining line graphs with stacked charts. The following error
gets displayed.

ReferenceError: Error #1056: Cannot create property offset on
mx.charts.series.LineSeries.
at
mx.charts::ColumnChart/applySeriesSet()[C:\Work\flex\dmv_automation\projects\dat
avisualisation\src\mx\charts\ColumnChart.as:467]
at
mx.charts.chartClasses::CartesianChart/http://www.adobe.com/2006/flex/mx/interna
l::updateSeries()[C:\Work\flex\dmv_automation\projects\datavisualisa tion\src\mx\
charts\chartClasses\CartesianChart.as:1454]
at
mx.charts.chartClasses::ChartBase/commitProperties()[C:\Work\flex\dmv_automation
\projects\datavisualisation\src\mx\charts\chartCla sses\ChartBase.as:1755]
at
mx.charts.chartClasses::CartesianChart/commitProperties()[C:\Work\flex\dmv_autom
ation\projects\datavisualisation\src\mx\charts\cha rtClasses\CartesianChart.as:11
49]
at
mx.core::UIComponent/validateProperties()[E:\dev\3.0.x\frameworks\projects\frame
work\src\mx\core\UIComponent.as:5670]
at
mx.managers::LayoutManager/validateProperties()[E:\dev\3.0.x\frameworks\projects
\framework\src\mx\managers\LayoutManager.as:519]
at
mx.managers::LayoutManager/doPhasedInstantiation()[E:\dev\3.0.x\frameworks\proje
cts\framework\src\mx\managers\LayoutManager.as:639]
at Function/http://adobe.com/AS3/2006/builtin::apply()
at
mx.core::UIComponent/callLaterDispatcher2()[E:\dev\3.0.x\frameworks\projects\fra
mework\src\mx\core\UIComponent.as:8460]
at
mx.core::UIComponent/callLaterDispatcher()[E:\dev\3.0.x\frameworks\projects\fram
ework\src\mx\core\UIComponent.as:8403]

Any insight would be greatly appreciated.

[sasbrw]

Hi Bayani, the trick is to use a CartesianChart instead of a ColumnChart.
Here's an example taken from the
[url]http://livedocs.adobe.com/flex/3/html/charts_displayingdata_11.html#330480[/url]
documentation. --Bruce



<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection

[Bindable]
public var expenses:ArrayCollection = new ArrayCollection([
{Month:"Jan", Profit:2000, Expenses:1500, Amount:450},
{Month:"Feb", Profit:1000, Expenses:200, Amount:600},
{Month:"Mar", Profit:1500, Expenses:500, Amount:300},
])
]]>
</mx:Script>

<mx:Panel title="Stacked Column-Line Chart">
<mx:CartesianChart dataProvider="{expenses}" showDataTips="true">
<mx:horizontalAxis>
<mx:CategoryAxis dataProvider="{expenses}" categoryField="Month"/>
</mx:horizontalAxis>

<mx:series>
<mx:ColumnSeries yField="Profit" displayName="Profit"/>
<mx:ColumnSeries yField="Expenses" displayName="Expenses"/>
<mx:LineSeries yField="Amount" displayName="Amount"/>
</mx:series>
</mx:CartesianChart>
</mx:Panel>
</mx:Application>

[davidmedifit]

Bayani,
Could you post some of your code?

Thanks,

Davo

[davidmedifit]

Bayani,
Could you post some of your code?

Thanks,

Davo

[Ram]

Hi Bayani,
When i have only Column series then the bars in the stacked column chart are very closer to each other.But when i add a line series to the same, then the gap between each bar in the column chart is increased. whats the reason for that...? How can i resolve that problem..?