Putting tool tip in multiple lines |
By default, if your tool-tips are larger than the chart width, FusionCharts will automatically wrap them. However, if you want to add manual breaks to the content of your tool-text, you can do so as under: |
<chart> <set label='John' value='420' tooltext='John Miller{br}Score: 420{br}Rank:2'/> <set label='Mary' value='295' tooltext='Mary Evans{br}Score: 295{br}Rank:3'/> <set label='Tom' value='523' tooltext='Tom Bowler{br}Score: 523{br}Rank:1'/> </chart> |
In the above XML, to add a line break in the tool-tip, we've used the pseudo code {br}. When you now see the chart, you'll get the following output: |
![]() |
Applying HTML to labels |
However, if you want to add line breaks to your data labels, the process is a bit different. Consider the XML below: |
<chart> <set label='John Miller<BR>Score: 420<BR>Rank:2' value='420' /> <set label='Mary Evans<BR>Score: 295<BR>Rank:3' value='295' /> <set label='Tom Bowler<BR>Score: 523<BR>Rank:1' value='523' /> <styles> <definition> <style name='myHTMLFont' type='font' isHTML='1' /> </definition> <application> <apply toObject='DATALABELS' styles='myHTMLFont' /> </application> </styles> </chart> |
In the above XML, we've first setting label for each <set>. To separate each line we use the <BR> HTML tag. However, since XML cannot use < and >, so we convert <BR> to <BR> . Thereafter, we need to tell FusionCharts that we'll be displaying HTML content in label. So, we create a new font style type with isHTML property set to 1 and then apply it to DATALABELS object. The above XML will now render the following chart: |
![]() |