Primefaces 5.0 Chart - wie Grafik-Modelle und Serien dynamisch vollständig aus der Datenbank erstellen Werte

Question

Ich versuche, Diagramme zu erstellen, die dynamisch auf Werte von einer DB-Serie über die Art der Charts, Chart-Modelle und Chart reagieren.

Die meisten Beispiele und Fragen, die ich gesehen habe scheinen nur mit statisch definieren Chart-Modelle und Kartenserie zu beschäftigen. Ich möchte dynamisch steuern, welche Art von Diagrammen angezeigt wird, die Diagrammmodelle und -serien werden vollständig angezeigt, indem die Werte in der Datenbank geändert werden (über eine Back-Office- oder Inhaltsverwaltungsschnittstelle). Ich habe das Back-Office-Content-Management-System (CMS) bereits entwickelt.

Diese Frage ist, wie Sie die PF präsentieren Beispiele oder APIs zu einem völlig dynamisches Modell anzupassen, dass die Back-Office-Typ, Modell und eine Reihe von Diagrammen definieren lässt.

Das folgende Beispiel versucht ein Balkendiagramm von 3 mySql Tabellen zu erzeugen:

1) Endataset: a table 'idmid' 2) Endataseries enthaltend die durch Primärschlüssel definiert Datensätze: eine Tabelle, die die Datenreihe enthält, welche aufweist eine OneToMany Beziehung mit Endataset - definiert durch ‚recid‘ 3) Endatapoint: Tabelle mit den tatsächlichen Datenwerte (Zahlen und Daten), die durch ‚PointID‘

ich möchte ein BarChartModel und Chart für jeden Datensatz (idmid) zurückzukehren als eine Liste von verschiedenen Charts nach dem, was vom Backoffice eingestellt wird. Mit anderen Worten, ich möchte Diagrammmodelle und -serien dynamisch erstellen, je nachdem wie viele Werte (Datasets) sich in der Datenbank befinden. Ich kann ein Diagramm mit dem folgenden Beispiel zurückgeben, aber es zeigt 3 Serien in 2 derselben Modelle, anstatt 2 Serien in einem Modell und 1 Serie in einem zweiten Modell (was mein Ziel ist).

Mein JSF:

<p:dataGrid id="cgridtest" value="#{chartTestBean.testTopList}" var="chars"> 
    <p:panel> 
    <p:chart id="gridcharts" type="#{chartTestBean.chartType}" 
    model="#{chartTestBean.testModel}"style="width: 150px; height: 150px"/> 
    </p:panel> 
    <h:outputText value="#{chars.idmid}"/> 
    </p:dataGrid> 

Die Bean-Methoden:

public List<Endataset> getTestTopList() { 
    testTopList = processChartList(); 
    return testTopList; 
} 

public List<Endataset> processChartList() { 
    chartType = "bar"; 
    orig = guestChartFacade.findAll(); 
    sers = new ArrayList(); 
    for (int n = 0; n < orig.size(); n++) { 
     idmid = orig.get(n).getIdmid(); 
     selJoin = guestChartFacade.find(idmid); 

     startDate = selJoin.getStartdate(); 
     sers.add(idmid); 
    } 

    dsetList = setfacade.findTopsRange(sers); 
    testTopList = new ArrayList(); 
    barmod = new ArrayList(); 
    for (int d = 0; d < dsetList.size(); d++) { 

     testModel = new BarChartModel(); 
     chartSer = new ChartSeries(); 
     idmid = dsetList.get(d).getIdmid(); 
     selSet = setfacade.find(idmid); 

     testTopList.add(selSet); 

     barmod.add(testModel); 

     showMods(); 

    } 
    return testTopList; 
} 

public BarChartModel showMods() { 

    for (BarChartModel t : barmod) { 

     testModel = t; 
     pointList = new ArrayList(); 

     pointList = pointFacade.pointRangeIdmid(idmid, startDate); 

     for (Endatapoint p : pointList) { 
      chartSer.set(p.getRecords().getSeriesname(), p.getActualnum()); 

     } 
     testModel.addSeries(chartSer); 

     return testModel; 
    } 
    return null; 
} 

Das folgende Beispiel soll auf die Aktienkurse von beiden Unternehmen zu einem bestimmten Zeitpunkt zurück. Es gibt eine dritte Serie, die in einem separaten Diagrammmodell zurückgegeben werden sollte, aber wie unten dargestellt, sind alle 3-Serie in einem einzigen Modell erscheinen was darauf schließen lässt, dass separate Instanzen des BarChartModel sind nicht für jeden Datensatz erstellt werden. Informationen zum Erstellen separater Diagrammmodelle für jedes Dataset anhand dieses Beispiels erhalten. Vielen Dank im Voraus für jede Hilfe.

Answer 1

Nach einigen Recherchen scheint die Antwort zu sein separate Modelle für jede Art von Diagramm, das Sie erstellen möchten, zu verwenden. Im folgenden Beispiel erstelle ich Modelle für Balkendiagramm und Liniendiagramm, die erweitert werden können, um andere Diagrammtypen zu verwenden, die von PF unterstützt werden. in der EL rufe ich die Listenarrays auf (zB [0]), aber das ist nicht notwendig und war nur meine Vorliebe. Auch habe ich die PF BarChartModel-Klasse (ExtendedBarChartModel) erweitert, aber das Beispiel funktioniert gut, wenn Sie das Standard-BarChartModel verwenden.

hoffte, das hilft und jedes Feedback willkommen:

<p:dataGrid id="modellist" value="#{chartTestBean.xbarmod[0]}" var="barmd"> 
<p:chart id="gridchart" type="bar" model="#{barmd}" style="width: 150px; height: 150px"/> 
</p:dataGrid> 

<p:dataGrid id="linegrid" value="#{chartTestBean.linemodelList[0]}" var="linemod"> 
<p:chart id="linechart" type="line" model="#{linemod}" style="width: 150px; height: 150px"/> 
</p:dataGrid> 
.... Other chart models as needed here 

den Bean-Methoden für das Balkendiagramm Modell:

public List<ExtendedBarModel> ModelList() { 
    xbarmod = new ArrayList(); 
    sers = new ArrayList(); 

    //chartType = "bar"; 
    orig = guestChartFacade.findAll(); 

    for (Enguestjoinchart j : orig) { 
     if (j.getCharttype().equals("bar")) { 
      setChartType("bar"); 
      showBar = true; 
      idmid = j.getIdmid(); 
      selJoin = guestChartFacade.find(idmid); 
      startDate = selJoin.getStartdate(); 
      sers.add(idmid); 
     } 
    } 

    dsetList = setfacade.findTopsRange(sers); 

    processModelList(); 
    return xbarmod; 
} 


public ExtendedBarModel processModelList() { 
    for (int i = 0; i < dsetList.size(); i++) { 

     idmid = dsetList.get(i).getIdmid(); 

     pointList = pointFacade.pointRangeIdmid(idmid, startDate); 
     xtestmodel = new ExtendedBarModel("Barmodel " + dsetList.get(i).getIdmid()); 

     chartSer = new ChartSeries(); 
     for (Endatapoint p : pointList) { 
      chartSer.set(p.getRecords().getSeriesname(), p.getActualnum()); 

     } 
     xtestmodel.addSeries(chartSer); 
     xbarmod.add(xtestmodel); 
    } 

    for (ExtendedBarModel b : xbarmod) { 
     xtestmodel = b; 
     return xtestmodel; 
    } 
    return null; 
} 

Für das Liniendiagramm:

public List<LineChartModel> makelinelistModel() { 
    linemodelList = new ArrayList(); 
    linesers = new ArrayList(); 

    orig = guestChartFacade.findAll(); 

    for (Enguestjoinchart w : orig) { 
     if (w.getCharttype().equals("line")) { 
      idmidLine = w.getIdmid(); 
      selJoinLine = guestChartFacade.find(idmidLine); 

      startDateLine = guestChartFacade.findStart(idmidLine); 

      endDateLine = guestChartFacade.findEnd(idmidLine); 
      linesers.add(idmidLine); 
      showLine = true; 
     } 
    } 

    if (linesers.size()==0) { 
     dsetlineList = null; 
     linemodelList = null; 

    } 
    else { 
     dsetlineList = setfacade.findTopsRange(linesers); 
     processLineModelList(); 
    } 
    return linemodelList; 

} 

public LineChartModel processLineModelList() { 
    for (int i = 0; i < dsetlineList.size(); i++) { 

     idmidLine = dsetlineList.get(i).getIdmid(); 
     pointListLine = pointFacade.pointLineRange(idmidLine, startDateLine, endDateLine); 
     linemodel = new LineChartModel(); 

     chartSerLine = new ChartSeries(); 
     Map<Object, Number> datMap = new HashMap(); 
     DateAxis axis = new DateAxis(); 

     for (Endatapoint p : pointListLine) { 
      chartSerLine.set(p.getPointdate().toString(), p.getActualnum()); 
      linemodel.addSeries(chartSerLine); 

     } 

     linemodelList.add(linemodel); 
     linemodel.getAxes().put(AxisType.X, axis); 
    } 

    for (LineChartModel m : linemodelList) { 
     linemodel = m; 
     return linemodel; 
    } 
    return linemodel; 
} 

.... Other chart models