java - Primefaces 5.0 图表 - 如何完全从数据库值动态创建图表模型和系列

Question

我正在尝试创建动态响应数据库中有关图表类型、图表模型和图表系列的值的图表。

我看到的大多数示例和问题似乎都只涉及静态定义图表模型和图表系列。我想动态控制显示的图表类型，图表模型和系列完全通过更改数据库中的值(通过后台或内容管理界面)显示。我已经开发了后台内容管理系统 (CMS)。

这个问题是关于如何将 PF 展示示例或 API 调整为一个完全动态的模型，让后台定义图表的类型、模型和系列。

下面的示例尝试从 3 个 mySql 表生成条形图:

1) Endataset:包含由主键'idmid'定义的数据集的表 2) Endataseries:包含与 Endataset 具有 OneToMany 关系的数据系列的表 - 由 'recid' 定义 3) Endatapoint:具有由“pointid”定义的实际数据值(数字和日期)的表

我想为每个数据集 (idmid) 返回一个 BarChartModel 和 ChartSeries 作为不同图表的列表，根据后台设置的任何内容。换句话说，我想根据数据库中的许多值(数据集)动态创建图表模型和系列。我可以使用下面的示例返回图表，但它显示了 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