Legend Problem in multiple series chart

Question

Hello,
I am getting problem in displaying legend. I have created a chart with  multiple series and custon color. Here is my code. You can copy paste it.
Out of 3 only one legend marker n label coming.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#FFFFFF, #FFFFFF]">
<mx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
import mx.rpc.events.ResultEvent;
import mx.controls.Alert;
      [Bindable]
      public var SMITH:ArrayCollection = new ArrayCollection([
        {date:"22-Aug-05", close:41.87, close2:45.23},
        {date:"23-Aug-05", close:45.74, close2:40.90},
        {date:"24-Aug-05", close:42.77, close2:46.99},
        {date:"25-Aug-05", close:48.06, close2:40.22},
     [Bindable]
      public var DECKER:ArrayCollection = new ArrayCollection([
        {date:"22-Aug-05", close:157.59},
        {date:"23-Aug-05", close:160.3},
        {date:"24-Aug-05", close:150.71},
        {date:"25-Aug-05", close:156.88},
    ]]>
</mx:Script>
  <mx:Style>
    ColumnChart {
        paddingLeft:20;
        paddingRight:20;
        paddingBottom:10;
        paddingTop:10;
     Legend {
     paddingLeft:20;
        paddingRight:20;
        paddingBottom:20;
        paddingTop:10;
  </mx:Style>
      <mx:Stroke id="axisStroke"
        color="#000000"
        weight="2"
        alpha=".75"
        caps="round"
    />
<mx:VBox width="500" height="500" borderColor="#000000" cornerRadius="20" themeColor="#009DFF" borderStyle="solid" borderThickness="1" horizontalAlign="center" x="246.5" y="61">
     <mx:ColumnChart id="multipleChart"  showDataTips="true" width="100%" height="100%"  seriesFilters="[]">
        <mx:horizontalAxis>
           <mx:CategoryAxis id="h1" categoryField="date"/>
        </mx:horizontalAxis>
        <mx:horizontalAxisRenderers>
            <mx:AxisRenderer placement="bottom" axis="{h1}">
            <mx:axisStroke>{axisStroke}</mx:axisStroke>
            </mx:AxisRenderer>
        </mx:horizontalAxisRenderers>
        <mx:verticalAxisRenderers>
            <mx:AxisRenderer placement="left" axis="{v1}"><mx:axisStroke>{axisStroke}</mx:axisStroke></mx:AxisRenderer>
            <mx:AxisRenderer placement="right" axis="{v2}"><mx:axisStroke>{axisStroke}</mx:axisStroke></mx:AxisRenderer>
        </mx:verticalAxisRenderers>
        <mx:series>
           <mx:ColumnSeries id="cs1" horizontalAxis="{h1}" dataProvider="{SMITH}" xField="date" yField="close" displayName="Smith" fills="#6693B0">
                <mx:verticalAxis>
                   <mx:LinearAxis id="v1" minimum="40" maximum="50"/>
                </mx:verticalAxis>
           </mx:ColumnSeries>
           <mx:ColumnSeries id="cs3" horizontalAxis="{h1}" dataProvider="{SMITH}" xField="date" yField="close2" displayName="Smiths" fills="#86D1E4">
           </mx:ColumnSeries>          
           <mx:LineSeries id="cs2" horizontalAxis="{h1}" dataProvider="{DECKER}" xField="date" yField="close" displayName="Decker">
                <mx:verticalAxis>
                    <mx:LinearAxis id="v2" minimum="150" maximum="170"/>          
                </mx:verticalAxis>
                <mx:lineStroke>
       <mx:Stroke color="#CC3300" weight="1"/>
    </mx:lineStroke>
           </mx:LineSeries>
        </mx:series>
     </mx:ColumnChart>
     <mx:Legend dataProvider="{multipleChart}"  horizontalAlign="center" direction="horizontal"/>
</mx:VBox>
</mx:Application>

Answer 1

I've run into this, too:
Remove the fills property from each ColumnSeries and it'll work.
If you want to use the fills property, you'll have to add your own custom legend code.
From the Flex API:
"If you specify the fills property and you want to have a Legend  control, you must manually create a Legend control and add LegendItems to it."