Categories: Tutorials

Less litter, more letters using tooltips

While discussing a chart during a presentation, you’d probably have to talk at length about each plotted value. The lengthy discussions become particularly unavoidable if you have to cite reasons for declining sales or for an extended period of stagnation. In situations such as this, tooltips come in handy since you can easily display a lot of text on them. FusionCharts v3.1 allows you to introduce line breaks in tooltip text. So, you can now have a lot of info in the tooltips neatly broken down into multiple lines. This helps in eliminating labels placed right next to the data plots, thereby making the charts litter-free. Let’s take the half-yearly analysis of a hotel as an example to drive home the point:

Cluttered Column Chart with long data labels

Neater Column Chart with details delegated to tooltips

How to define custom tooltips with line breaks

Following is the XML for the chart above: The custom tooltip text is defined with the help of the tooltext attribute. Within the tooltip text you can add {br} wherever you want to insert a line break. Customizing the tool tip is that simple.

Fine Tuning the Tooltip

You can obviously do a great deal of fine tuning with respect to the appearance of tooltips. For instance, you can give it a shadow, glow or blur effect. And, customize the text color, background color and border color too. For more information on all this, visit our online documentation on tooltips here. This is the penultimate article in the series – “How to get the most out of v3.1”, which began on May 7, 2009. The first article in this series was Exporting Charts as images or PDFs. So, if you are new to this blog we suggest that you go through the previous posts of the series: In the final post, as we said, we will be exploring the chemistry between FusionCharts and Javascript. Do come back for more.
sanket

Recent Posts

Top Pie Chart Makers to generate statistical data in 2025

To create pie charts and generate statistical data, you’ll find this list of the best…

7 months ago

How to implement FusionCharts in a dynamically resizing flexbox layout

To implement FusionCharts in a dynamically resizing flexbox layout, ensure that the chart's dimensions are…

7 months ago

Elevating Data Visualization: FusionCharts Achievements

At FusionCharts, we believe in empowering developers and businesses with cutting-edge data visualization tools that…

9 months ago

Pie Charts: A Slice of Data You Can’t Ignore

Ever had a data set that seemed more complicated than a Rubik's cube? You’re not…

1 year ago

Venn Diagrams: A Simple Yet Powerful Tool for Visualizing Relationships

We’ve all seen them in textbooks or presentations—those overlapping circles that simplify complex information into…

1 year ago

Announcing FusionCharts v4.1: Elevate Your Data Visualization Experience!

We’re excited to announce the upcoming release of FusionCharts v4.1—a groundbreaking step forward in the…

1 year ago