Show dataTips on Chart

Question

Hi,
I found some cool stuff in the internet. and I want to develop it. the code shows or draw a line while mouse are moving on the chart. Now I want to show the data tips/data points if the line get on the linechart. I already googling but I dont found any solution. I see an example on the internet but I dont know how to do it
http://www.google.com/finance?q=INDEXDJX:.DJI,INDEXSP:.INX,INDEXNASDAQ:.IXIC
can sombody help me?
thanks in advance
here is the code:
the mxml file:
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:local="*" xmlns:display="flash.display.*">
        <mx:Script>
            <![CDATA[
                import mx.controls.Alert;
                import mx.collections.ArrayCollection;
                 [Bindable]
            private var expensesAC: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 },
                { Month: "Apr", Profit: 1800, Expenses: 1200, Amount: 900 },
                { Month: "May", Profit: 2400, Expenses: 575, Amount: 500 } ]);
            ]]>
        </mx:Script>
        <mx:LineChart dataProvider="{expensesAC}" showDataTips="true">
            <mx:annotationElements>
                <local:Ruler/>
            </mx:annotationElements>
            <mx:horizontalAxis>
                <mx:CategoryAxis categoryField="Month"/>
            </mx:horizontalAxis>
            <mx:series>
                <mx:LineSeries yField="Profit" form="curve" displayName="Profit"/>
                <mx:LineSeries yField="Expenses" form="curve" displayName="Expenses"/>
                <mx:LineSeries yField="Amount" form="curve" displayName="Amount"/>
            </mx:series>
        </mx:LineChart>
</mx:Application>
the as file:
package{
import flash.events.MouseEvent;
import flash.geom.Point;
import mx.charts.chartClasses.ChartElement;
import mx.charts.events.ChartItemEvent;
import mx.controls.Alert;
    public class Ruler extends ChartElement{
        private var main:Main = new Main();
        public function Ruler():void{
            super();
            addEventListener(MouseEvent.MOUSE_MOVE,handleMouseMove);
            addEventListener(MouseEvent.MOUSE_OUT,handleMouseOut);   
        private function handleMouseMove(e:MouseEvent):void{
            updateDisplayList(unscaledWidth,unscaledHeight);           
            var p:Point = new Point(this.mouseX,this.mouseY);
            graphics.lineStyle(2,0xFF0000,0.5);
            graphics.moveTo(0,p.y);
            graphics.lineTo(unscaledWidth,p.y);
            graphics.moveTo(p.x,0);
            graphics.lineTo(p.x,unscaledHeight);
        private function handleMouseOut(e:MouseEvent):void{
            updateDisplayList(unscaledWidth,unscaledHeight);
        override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void{           
            super.updateDisplayList(unscaledWidth, unscaledHeight);
            graphics.clear();  
            graphics.moveTo(0,0);
            graphics.lineStyle(0,0x000000,0);
            graphics.beginFill(0x000000,0);
            graphics.drawRect(0,0,unscaledWidth,unscaledHeight);
            graphics.endFill();

Answer 1

Unfortunately the code I wrote was just for testing and is very buggy.
I based it on two related examples I found:
http://shemesh.axspace.com/Charts_Programmatically_Show_DataTips_Using_DataTipItems/
and
http://reality-and-a-half.multiversum.com/werkzeuge/flex-show-chart-datatips-if-mouse-is-a nywhere-on-the-chart
They don't do exactly what you are looking for, but maybe it will give you some idea on how to proceed.
The charting DataTips do not seem to be a simple nut to crack as far as duplicating their normal behavior when showing multiple tips. Good luck and please share if you come up with a good solution.