Question

我试图在同一页面上插入多个线图。为了意识到我有bean的代码：

public void createChartWithMetrics() {
    this.cartesianChartModel = new ArrayList<CartesianChartModel>();
    ServiceMetricsDAO serviceMetricDAO = new ServiceMetricsDAO();
    List<String> uriEntityList = new ArrayList<String>();
    for (TreeNode selectedNode : analyzeMetricMenuTree.getSelectedNodes()) {
        uriEntityList.add(selectedNode.getData().toString());
    }

    this.serviceMetricMap = serviceMetricDAO.getServiceMetricMapByEntityList(uriEntityList, Utility.convertDateToString(DATEFORMAT, dateFrom),
            Utility.convertDateToString(DATEFORMAT, dateTo));

    for (List<List<ServiceMetric>> serviceMetricListList : serviceMetricMap.values()) {
        if(!serviceMetricListList.isEmpty()) {
            this.cartesianChartModel.add(createModelFromList(serviceMetricListList));
        }
    }
}

private CartesianChartModel createModelFromList(final List<List<ServiceMetric>> serviceMetricListList) {
    CartesianChartModel cartesianChart = new CartesianChartModel();
    for (List<ServiceMetric> serviceMetricList : serviceMetricListList) {
        if (!serviceMetricList.isEmpty()) {
            ChartSeries chartSeries = new ChartSeries();
            for (ServiceMetric serviceMetric : serviceMetricList) {
                chartSeries.setLabel(serviceMetric.getDependsOn());
                chartSeries.set(serviceMetric.getAtTime(), serviceMetric.getHasMetricValue());
            }
            cartesianChart.addSeries(chartSeries);
        }
    }
    return cartesianChart;
}

和页面的代码：

<ui:repeat var="cartesianChartModel" value="#{analyzeMetricsController.cartesianChartModel}">
    <h:panelGroup layout="block" styleClass="panel panel-default col-lg-12" rendered="#{not empty cartesianChartModel}">
        <h:panelGroup layout="block" styleClass="panel-body panel-default">
            <p:lineChart id="chart" widgetVar="chart" 
                value="#{cartesianChartModel}" 
                legendPosition="ne" xaxisAngle="-45" zoom="true" 
                maxY="#{analyzeMetricsController.maxY}" 
                minY="#{analyzeMetricsController.minY}" 
                fill="#{analyzeMetricsController.filled}" 
                stacked="#{analyzeMetricsController.stacked}" />
        </h:panelGroup>
    </h:panelGroup>
</ui:repeat>

但仅插入最后一个模型图。此外，如果我在标签

下添加此代码

<h:panelGroup layout="block" styleClass="panel-body panel-default">
    <p:lineChart id="chart" widgetVar="chart" 
        value="#{cartesianChartModel}" 
        legendPosition="ne" xaxisAngle="-45" zoom="true" 
        maxY="#{analyzeMetricsController.maxY}" 
        minY="#{analyzeMetricsController.minY}" 
        fill="#{analyzeMetricsController.filled}" 
        tacked="#{analyzeMetricsController.stacked}" />
</h:panelGroup>

仅插入最后一个图表并被忽略。

Answer 1

这是一个id问题，你需要做这样的事情：

<p:lineChart id="chart#{cartesianChartModel.id}" widgetVar="chart#{cartesianChartModel.id}" ... />

因为您无法呈现具有相同ID的两个元素。

一页上的多线图（主要面）

1 个答案: