1 Reply Latest reply on Aug 7, 2009 5:35 AM by Gregory Lafrance

    Showing tooltip in a different way


      Hello ,

                      I have developed a line Chart ( X-Axis say Time Stamp ,Y axis say profit) I very well know that if i include showDataTips="true" in my  Line Chart it would show the " value" on mouse over on the graph ( say Timestamp is 20, profit is 12 ) it will display 20,10 but i want it to display value as well as the name like TimeStamp--20


                                                     How this can be done.any suggestions/examples.






      Kalavati Singh


        • 1. Re: Showing tooltip in a different way
          Gregory Lafrance Level 6

          Here is a simple yet powerful example of how you can customize what data gets displayed with datatips.




          If this post answers your question or helps, please mark it as such.


          <?xml version="1.0"?>
          <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
               import mx.charts.HitData;
               import mx.collections.ArrayCollection;

               [Bindable] public var expenses:ArrayCollection = new ArrayCollection([
                  {Month:"Jan", Profit:2000, Expenses:1500},
                  {Month:"Feb", Profit:1000, Expenses:200},
                  {Month:"Mar", Profit:1500, Expenses:500}

               public function dtFunc(hd:HitData):String {
                  return hd.item.Month + ":<B>$" + hd.item.Profit + "</B>";
            <mx:Panel title="Bar Chart">
               <mx:BarChart id="myChart" dataProvider="{expenses}"
                  showDataTips="true" dataTipFunction="dtFunc">
                     <mx:CategoryAxis dataProvider="{expenses}"
                       categoryField="Month" displayName="Month"/>
                     <mx:LinearAxis displayName="Amount"/>
                     <mx:BarSeries yField="Month"
                       xField="Profit" displayName="Profit"/>
                     <mx:BarSeries yField="Month" xField="Expenses"
               <mx:Legend dataProvider="{myChart}"/>