Documentation

You are viewing documentation for Vaadin 23. View latest documentation

Documentation

Migrating from Earlier Versions

Charts 9 comes with new chart types and brings back the API to style from Java.

Summary

Migration Guide

If you are migrating your project to platform V17, there might be different approaches related with which styling option you pick.

Caution
Both CSS and Java styling can’t be used in the same project
While no error is thrown if different styling methods are used in the same project, only one method should be used across all charts, since having both could lead to unexpected results.

From a V8 or Older Project

Using Java API Styling

Since V17 uses Java API for styling by default, there’s no needed to do any extra step.

Note
 There might be small changes for APIs that no longer work between the Highcharts versions used for V8 and V17.

Using CSS Styling

If you want to convert your project to use CSS styling, enable it by setting styledMode to true:

Chart chart = new Chart();
Configuration conf = chart.getConfiguration();
conf.getChart().setStyledMode(true);

For more detailed instructions, see the "CSS Styling guide"

From a V10+ Project

Using Java API Styling

If your project doesn’t have any Charts custom theme, then there’s no extra step needed to do.

In the other hand, if it has custom themes, then they should be removed, along aside their @CssImport annotations. You can, then, use the Java API for styling the charts.

Using CSS Styling

To keep using CSS styling, enable the styledMode as described on this same topic at the previous section.

Running Charts 9 in V14

While Charts 9 is released for V17, a project running V14 in npm mode could use the new Charts by overriding the version in the Project Object Model (POM) file:

<dependency>
    <groupId>com.vaadin</groupId>
    <artifactId>vaadin-charts-flow</artifactId>
    <version>9.0.0</version>
</dependency>
Note
 Check the latest version on the Charts release page.

Then, to start using it, see the From a V10+ Project instructions presented on this page.

CA191212-B228-4F07-9F40-BC0C68F84FA0