All-new

line charts.

There are all-new, responsive line charts in Datawrapper, including point-and-click text and range annotations.

What's new


1.

Clean, crisp & clear

A clean design to start with, paired with fast but powerful customization options.

2.

Fully responsive

Out-of-the-box improvements that optimize your charts for readers on mobile devices.

3.

Annotations

Point-and-click text and range annotations right inside your chart.

New line chart

Today, we are adding a completely re-engineered version of Datawrapper's line chart. There are three major upgrades included:

Cleaner design, more customizable

• Improved responsiveness

• All-new annotation features

1) Customize lines

You can change the stroke width and dashes of your lines with a single click now. It's an insanely fast and effective way to highlight interesting parts of your data. This GIF shows the new features in action:

With a single click, you can increase or decrease the stroke width and dashes in order to highlight specific lines of your chart.

In addition to that, you can now:

change the color for each line individually

highlight the area between lines and give it a custom color

add symbols to the start or end of your lines, or on every individual datapoint.

On top of that, there are now much more advanced ways to customize the appearance of labels on the axis of your charts.

2) Axis customization

One of the great things about Datawrapper charts is that they automatically have axis labels that fit your dataset. You don't need to manually enter the desired ticks on your x- or y-axis, because Datawrapper will pick good ones for you. 

However, sometimes it's nice to have that extra level of customization. One example: When showcasing the results of a company, your x-axis should maybe read quarters (like "2015 Q1", "2015 Q2"...) instead of simply the years ("2015", "2016"...). That's now possible with Datawrapper. For both your x-axis and your y-axis, you can completely customize the appearance and positioning of your labels. You can leave everything at default settings and it will look just fine, but you can also go ahead and change the format of your label ticks, set a custom range or even completely overwrite the ticks with your own.

3) Fully responsive

It's more important than ever to have your charts appear correctly on mobile devices. That's why Datawrapper now automatically makes some slight adjustments to your charts when they are viewed on smartphones. One example: If there's enough space on a desktop computer, it's a great idea to throw out the color-legend at the top and instead label the chart lines directly. However, when the chart is size-constrained on a mobile device, enabling the legend saves some precious horizontal screen real-estate. That's what Datawrapper does out-of-the-box now. See how the color legend is included when viewed on a narrow screen, whereas direct labeling is enabled when viewed on a large enough viewport:

Also, the y-axis labels now move inside of the chart area when viewed on mobile devices. It's a little denser visually, but that's exactly what you want when showing your chart on a narrow screen.

4) Annotations

Starting today, Datawrapper charts can include freely positioned text or range annotations. You can find the new options in the "Annotate" tab. For example, let's annotate this chart:

This chart compares the market capitalization of Apple and Alphabet. The interesting part here is the brief moment where Alphabet overtook Apple as the most valuable company in the world. So let's add a text annotation that makes that explicit. Click on "Add text annotation" and pick a point:

You can freely position your annotation, as well as change the font color, size or weight. In addition, you can also highlight a range:

That's it. This creates a much more interesting chart with more context:


Reach us

If you have any feedback or questions, don't hesitate to reach out. We are available at support@datawrapper.de or via twitter, at @datawrapper.


Other Interesting Tutorials

How to create a Stacked Column Chart

Learn how to create a stacked column chart in minutes with Datawrapper.

View Guide

All-new line charts

Datawrapper has completely revamped line charts: More responsive, cleaner and with annotations.

View Guide