chart_data tooltip

<chart_data>
   ...
   <number tooltip='string'>...</number>
   ...
</chart_data>
                             

Description

In addition to containing the chart values, chart_data can be used to add a tooltip to the graphic elements generated by those values. The tooltip is the black on red label that appears when moving the mouse over the chart here:

To define the look of the tooltip, see tooltip.

To display a tooltip over the graphic elements that correspond to data values, add a tooltip parameter to chart_data's <number> tags. It can be added to all, some, or none of the number tags:

<!-- add a tooltip to the lowest and highest data values --> <chart_data> <row> <null/> <string>2007</string> <string>2008</string> <string>2009</string> </row> <row> <string>Region A</string> <number tooltip='low'>20</number> <number>75</number> <number>85</number> </row> <row> <string>Region B</string> <number>40</number> <number>25</number> <number tooltip='high'>105</number> </row> </chart_data>

To add a multi-line tooltip, break the text lines with \r:

 
   tooltip='20\rLowest Value'                
      

<chart>

   <!-- add a tooltip to all data values -->     
   <chart_data>
      <row>
         <null/>
         <string>2007</string>
         <string>2008</string>
         <string>2009</string>
      </row>
      <row>
         <string>Region A</string>
         <number tooltip='20\rLowest Value'>20</number>
         <number tooltip='75'>75</number>
         <number tooltip='85'>85</number>
      </row>
      <row>
         <string>Region B</string>
         <number tooltip='40'>40</number>
         <number tooltip='25'>25</number>
         <number tooltip='105\rHighest Value'>105</number>
      </row>
   </chart_data>

   <!-- define a shadow filter -->
   <filter>
      <shadow id='low' alpha='75' blurX='8' blurY='8' distance='3' />   
   </filter>

   <!-- define the tooltip look -->  
   <tooltip color='FFFFFF'
            alpha='75'
            size='11'
            background_color_1='8888ff' 
            background_alpha='90'
            shadow='low'
            />

</chart>