Primefaces 5.0圖表 - 如何從數據庫中動態創建完全圖表模型和一系列值

Question

我試圖創建圖表動態地從有關圖表，圖表模型和圖表系列的類型DB到值響應。

大部分我只看到了例子和問題似乎解決靜態定義圖表模型和圖表系列。我想動態地控制顯示哪種類型的圖表，圖表模型和系列完全通過更改數據庫中的值（通過後臺或內容管理界面）顯示。我已經開發了後臺內容管理系統（CMS）。

這個問題是關於如何適應PF展示例子或API來完全動態模型，讓後臺定義的類型，型號和系列圖表。

下面的例子嘗試生成來自3代MySQL表一個條形圖：

1）Endataset：包含數據集的表由主鍵定義的「idmid」 2）Endataseries：含有具有的數據系列的表與Endataset一個一對多的關係 - 由「recid」定義 3）Endatapoint：表用「點名」

定義的實際數據值（數字和日期），我想回到每一個數據集BarChartModel和ChartSeries中（idmid）根據後臺設置的不同圖表列出不同的圖表。換句話說，我想根據數據庫中的許多值（數據集）動態創建圖表模型和系列。我可以使用下面的例子返回一個圖表，但它顯示了2個相同模型中的3個系列，而不是一個模型中的2個系列和另一個模型中的1個系列（這是我的目標）。

我的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> 

的bean的方法：

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; 
} 

下面的例子是指在給定的日期返回兩家公司的股價。還有第三個系列應該在單獨的圖表模型中返回，但是如下所示，所有3個系列都出現在單個模型中，這表明不爲每個數據集創建單獨的BarChartModel實例。希望有關如何使用此示例爲每個數據集創建單獨的圖表模型的任何指導。預先感謝您的幫助。

Answer 1

經過一番研究，答案似乎是使用獨立的模型，你要創建的每個類型的圖表。在下面的例子中，我爲條形圖和折線圖創建模型，可以將其擴展爲使用PF支持的任何其他圖表類型。在EL中，我調用列表數組（即[0]），但這不是必需的，只是我的偏好。此外，我還擴展了PF BarChartModel類（ExtendedBarChartModel），但如果使用標準BarChartModel，該示例可以正常工作。

希望這有助於任何反饋歡迎：

<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 

bean的方法條形圖型號：

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; 
} 

對於折線圖：

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