PrimeFaces Cookbook - Second Edition

Creating combined charts

The chart component supports combining multiple data series into one cartesian model.

How to do it…

A basic definition for a chart with one line and bar model is given here:

<p:chart type="bar" model="#{chartBean.combinedModel}"
  style="height:250px" />

The combined model definition is given here:

CartesianChartModel combinedModel = new BarChartModel(); public CartesianChartModel getCombinedModel() { LineChartSeries sales = new LineChartSeries(); sales.setLabel("Sales"); sales.set(2004, 1000); sales.set(2005, 1170); sales.set(2006, 660); sales.set(2007, 1030); BarChartSeries expenses = new BarChartSeries(); expenses.setLabel("Expenses"); expenses.set("2004", 400); expenses.set("2005", 460); expenses.set("2006", 1120); expenses.set("2007", ...