Flex： 改变lineChart数据点（交点）颜色值及样式，ItemRenderer border color

<?xml version="1.0"?>
<!-- http://blog.flexexamples.com/2007/11/15/displaying-grid-lines-in-a-flex-linechart-control/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical"
        verticalAlign="middle"
        backgroundColor="white" creationComplete="init()">
        
   <mx:Script>
      <![CDATA[
      
      import mx.charts.renderers.CircleItemRenderer;
      import mx.graphics.Stroke;
      
      
      public function init():void{
               
               
               series.setStyle("lineStroke", new Stroke(0x000000, 2, 0.4));
                 series.setStyle("fill", 0x000000);
                 
                 series.setStyle("radius", 10);
                 series.setStyle("adjustedRadius", 2);
               series.setStyle("itemRenderer", new ClassFactory(CircleItemRenderer));
      }

]]>
</mx:Script>

    <mx:XMLListCollection id="dp">
        <mx:source>
            <mx:XMLList>
                <quote date="8/27/2007" open="40.38" close="40.81" />
                <quote date="8/24/2007" open="40.5" close="40.41" />
                <quote date="8/23/2007" open="40.82" close="40.6" />
                <quote date="8/22/2007" open="40.4" close="40.77" />
                <quote date="8/21/2007" open="40.41" close="40.13" />
                <quote date="8/20/2007" open="40.55" close="40.74" />
            </mx:XMLList>
        </mx:source>
    </mx:XMLListCollection>

    <mx:ApplicationControlBar dock="true">
        <mx:Form styleName="plain">
            <mx:FormItem label="GridLines direction:">
                <mx:ToggleButtonBar id="toggleButtonBar" selectedIndex="0">
                    <mx:dataProvider>
                        <mx:Array>
                            <mx:String>horizontal</mx:String>
                            <mx:String>vertical</mx:String>
                            <mx:String>both</mx:String>
                        </mx:Array>
                    </mx:dataProvider>
                </mx:ToggleButtonBar>
            </mx:FormItem>
        </mx:Form>
    </mx:ApplicationControlBar>

    <mx:LineChart id="lineChart"
            showDataTips="true"
            dataProvider="{dp}"
            width="100%"
            height="100%">

        <mx:backgroundElements>
            <mx:GridLines direction="{toggleButtonBar.dataProvider.getItemAt(toggleButtonBar.selectedIndex)}" />
        </mx:backgroundElements>

        <!-- vertical axis -->
        <mx:verticalAxis>
            <mx:LinearAxis baseAtZero="false" title="Price" />
        </mx:verticalAxis>

        <!-- horizontal axis -->
        <mx:horizontalAxis>
            <mx:CategoryAxis id="ca" categoryField="@date" title="Date" />
        </mx:horizontalAxis>

        <!-- horizontal axis renderer -->
        <mx:horizontalAxisRenderers>
            <mx:AxisRenderer axis="{ca}" canDropLabels="true" />
        </mx:horizontalAxisRenderers>

        <!-- series -->
        <mx:series>
            <mx:LineSeries id="series" yField="@open" form="segment" displayName="Open" />
        </mx:series>
    </mx:LineChart>

</mx:Application>