Skip to content

Highcharts Feature: Basic Chart Types

Jump to bottom Edit New page
Maxim Atanasov edited this page Jul 27, 2018 · 2 revisions

Supported by:

Highcharts and thus Wicked Charts support a set of different chart types that are listed in the SeriesType enumeration. The chart types are separated into basic and advanced charts.

For an example of how to create a basic chart with Wicket and JSF please consult the [Getting Started](Getting Started) page.

The basic chart types are:

  • area charts
  • area spline charts
  • column charts
  • bar charts
  • line charts
  • pie charts
  • scatter charts
  • spline charts
  • any combination of the above (see example "Column, line and pie" in the showcase

All chart types and the java code needed to create them can be viewed online in the showcase.

Defining the chart type globally

If you want all series within your chart to have the same chart type, you can define the type in the ChartOptions of a chart:

options.setChartOptions(new ChartOptions()
  .setType(SeriesType.AREA));

Defining the chart type for each series

If you have more than one series in a chart that are supposed to be of a different type, you can set the type for each Series separately:

options.addSeries(new SimpleSeries()
  .setType(SeriesType.AREA)
  .setData(1,2,3));

options.addSeries(new SimpleSeries()
  .setType(SeriesType.LINE)
  .setData(1,2,3));

Using Wicket

You have nothing to care about other that adding your Options object to the Chart component as described on the [Getting Started](Getting Started) page. The Wicket components take care of loading the correct javascript files needed for the chart types.

Using JSF

You have to include the following javascript files manually into your page:

Add a custom footer
Add a custom sidebar
Clone this wiki locally