LineChartで、選択されたポイントの色を変えたままにするサンプル

前回に引き続き、今度はLineChartでのサンプルです。

Rendererクラスを用意して、ChartのItemClickイベントをEventManagerを経由してRendererに伝えるところは一緒です。

Sample_LineChart.mxml

<?xml version="1.0"?>
<!-- charts/BasicLine.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
  <mx:Script><![CDATA[
  	import managers.EventManager;
     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:"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="Line Chart">
     <mx:LineChart id="myChart" 
        dataProvider="{expenses}" 
        showDataTips="true"  
        itemClick="EventManager.getInstance().dispatchEvent(event)"
     >
        <mx:horizontalAxis>
           <mx:CategoryAxis 
                dataProvider="{expenses}" 
                categoryField="Month"
            />
        </mx:horizontalAxis>
        <mx:series>
           <mx:LineSeries 
                yField="Profit" 
                displayName="Profit" 
           />
           <mx:LineSeries 
                yField="Expenses" 
                displayName="Expenses" 
                itemRenderer="renderer.LineChartRenderer"
           />
        </mx:series>
     </mx:LineChart>
     <mx:Legend dataProvider="{myChart}"/>
  </mx:Panel>
</mx:Application>

LineChartRenderer.as

package renderer
{
    import flash.display.Graphics;
    
    import managers.EventManager;
    
    import mx.charts.events.ChartItemEvent;
    import mx.charts.series.items.LineSeriesItem;
    import mx.core.IDataRenderer;
    import mx.skins.ProgrammaticSkin;

    public class LineChartRenderer extends ProgrammaticSkin implements IDataRenderer
    {
        private var color:uint = 0xffff99;
        private var _chartItem:LineSeriesItem;
       
        public function LineChartRenderer()
        {
            EventManager.getInstance().addEventListener(ChartItemEvent.ITEM_CLICK,chartItemClickHandler);
        }
       
        private function chartItemClickHandler(e:ChartItemEvent):void
        {
            var g:Graphics = graphics;

            if(this._chartItem == e.hitData.chartItem)
            {
	            g.clear();
	            g.beginFill(0xFFAE00);
	            g.drawCircle(3,3,6);
	            g.endFill();

                invalidateDisplayList();
            }
            else
            {
	            g.clear();

                invalidateDisplayList();
            }
        }
       
        public function get data():Object
        {
            return _chartItem;
        }
       
        public function set data(value:Object):void
        {
            _chartItem = value as LineSeriesItem;
        }
       
        override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
        {
            super.updateDisplayList(unscaledWidth, unscaledHeight);
        }
       
    }//end of class
}//end of package

EventManager.as

package managers
{
    import flash.events.EventDispatcher;
   
    public class EventManager extends EventDispatcher
    {
        /**
         * インスタンス生成判定フラグ
        **/
        private static var inside:Boolean = false;

        /**
         * GyomuManagerオブジェクト
        **/
        private static var instance:EventManager = null;
       
        public function EventManager()
        {
            if(inside)
            {
                inside=false;
            }
            else
            {
                throw new Error("UseSingleton.geInstance() to get the instance");
            }
        }
       
        public static function getInstance():EventManager
        {
            if(instance==null)
            {
                inside = true;
                instance = new EventManager();
            }
            return instance;
        }
       
    }//end of class
}//end of package