How to create tooltips
Datawrapper offers a powerful way to add tooltips to your symbol maps, choropleth maps, and scatterplots*. In this article, you'll learn how to create them.
*Tooltips on other chart types (line chart, area chart) cannot be customized in the same way. For these chart types, only the number/date formats can be customized.
👉 To learn how to add charts to tooltips, visit the article "How to add charts to tooltips".
Why tooltips?
Tooltips are important for maps because of three main reasons:
- Orientation: Not every reader will know where exactly certain power plants are, especially if they're not from the same area. Tooltips show the names of the cities/towns and offer orientation.
- Transparency: If you offer tooltips, the reader of your map can check the exact underlying values of each region. Why is that necessary? Because the colors on a map are great for pattern-spotting, but it's hard to see the fine details. Imagine two areas with very similar values and, therefore, hard to distinguish colors. Or imagine a reader who tries to understand how her local region is doing exactly. Presenting numeric values can help in both cases.
- Explanation & Context: A well-written tooltip can remind readers what kind of information they actually see on the map. On our turnout map, we remind them that this is the turnout of the last election. But we go a step further and also tell them in which year this last election was held, thus offering context.
How to create tooltips
Here we show how to create tooltips for the following symbol map – but you will find that the same process applies to choropleth maps and scatterplots.
In step 3 of your map/chart creation process, Visualize, find the button Show tooltips and click on it. Then click on Customize tooltips.
Two text fields open, the Tooltip title and the Tooltip body text field. Below them, you'll see the names of all the columns you've uploaded. (You can upload as many columns as you like.) For the student map, we imported, among others, the name of the city, the population numbers for these cities, and the share of students.
Let's fill our tooltip with content. You can click on the blue buttons to place them in your Title or Body text field. The Title will appear as bold text in your tooltip; the Body text will appear in the regular font-weight. You can also add some extra text, like so:
That's it! No need to click save. Your map will now show this tooltip when you hover over different symbols:
The process is exactly the same for choropleth maps and scatterplots. To learn about tooltips in locator maps, read "How to create tooltips in locator maps".
In this tutorial, you learned how to create a tooltip for choropleth maps, symbol maps, and scatterplots.