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

    Showing tooltip in a different way

    KalavatiSingh

      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

                                profit--12

                                                     How this can be done.any suggestions/examples.

       

       

       

       

      Regards

      Kalavati Singh

      kalavati_singh@yahoo.co.in

        • 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.

           

          http://livedocs.adobe.com/flex/3/html/help.html?content=charts_displayingdata_08.html

           

          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">
            <mx:Script><![CDATA[
               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:Script>
            <mx:Panel title="Bar Chart">
               <mx:BarChart id="myChart" dataProvider="{expenses}"
                  showDataTips="true" dataTipFunction="dtFunc">
                  <mx:verticalAxis>
                     <mx:CategoryAxis dataProvider="{expenses}"
                       categoryField="Month" displayName="Month"/>
                  </mx:verticalAxis>
                  <mx:horizontalAxis>
                     <mx:LinearAxis displayName="Amount"/>
                  </mx:horizontalAxis>
                  <mx:series>
                     <mx:BarSeries yField="Month"
                       xField="Profit" displayName="Profit"/>
                     <mx:BarSeries yField="Month" xField="Expenses"
                       displayName="Expenses"/>
                  </mx:series>
               </mx:BarChart>
               <mx:Legend dataProvider="{myChart}"/>
            </mx:Panel>
          </mx:Application>