Primefaces Charts

Kleines HowTo für alle die Chartes von Primefaces benützen möchten. Um es vorweg zu nehmen. Es ist leider nicht möglich eine DateTime X Achse zu nutzen. Wir benützen hierzu um dem ganzen Abhilfe zu schaffen KW/Jahr (Kalenderwoche/Jahr). Es ist natürlich auch möglich Monat/Jahr oder ähnliches zu verwenden.

Primefaces arbeitet hierbei im Backend mit jQuery und einer eigens angefertigten charts.js … Leider hatte ich bisher noch keine Zeit mich genauer mit dieser File auseinander setzen zu können.

Auf der JSF Seite ist es ein Einzeiler. Super von den Primefaces Jungs umgesetzt.


Die Java Seite ist etwas umständlicher aber auch hier ist es sehr schlank gehalten.

package org.primefaces.examples.view;  
  
import java.io.Serializable;  
  
import org.primefaces.model.chart.CartesianChartModel;  
import org.primefaces.model.chart.ChartSeries;  
import org.primefaces.model.chart.LineChartSeries;  
  
public class ChartBean implements Serializable {  
  
    private CartesianChartModel categoryModel;  
  
    private CartesianChartModel linearModel;  
  
    public ChartBean() {  
        createCategoryModel();  
        createLinearModel();  
    }  
  
    public CartesianChartModel getCategoryModel() {  
        return categoryModel;  
    }  
  
    public CartesianChartModel getLinearModel() {  
        return linearModel;  
    } 
    private void createLinearModel() {  
        linearModel = new CartesianChartModel();  
  
        LineChartSeries series1 = new LineChartSeries();  
        series1.setLabel("Series 1");  
  
        series1.set(1, 2);  
        series1.set(2, 1);  
        series1.set(3, 3);  
        series1.set(4, 6);  
        series1.set(5, 8);  
  
        LineChartSeries series2 = new LineChartSeries();  
        series2.setLabel("Series 2");  
        series2.setMarkerStyle("diamond");  
  
        series2.set(1, 6);  
        series2.set(2, 3);  
        series2.set(3, 2);  
        series2.set(4, 7);  
        series2.set(5, 9);  
  
        linearModel.addSeries(series1);  
        linearModel.addSeries(series2);  
    }  
}

Ich habe hier zu großen Teilen das Tutorial von Primefaces benützt weil es super einfach beschrieben ist und übersichtlich. Hier gehts zum Orginalbeitrag.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.