Question

我正在创建一个webapp，其仪表板上有一个带条形图的窗口。

Agent       customer      time
1             aa           40 mins
2             aa           4 hours
1             ab           45 mins
2             ab           3 hours
1             ac           5 hours
2             ac           10 mins

正如您所看到的那样，时间单位可能不同，所以我决定每个客户制作图表。因此，对于1个图表，我的标签为aa，图表系列数据为1, 40 mins和2,4 hours。如您所见，我必须在上述情况下创建总共3个图表。

我在之前的一些帖子中读到，我们可以使用<p:datagrid>生成这样的动态图表。

<p:dataGrid id="timegapdatagrid" value="#{dashboardController.chartlist}">
                <p:panel id="timegap" header="Time gap Diagram" styleClass="ui-dashboard-layout">
                    <p:chart id="timeGapDiagram" type="bar" model="#{dashboardController.dashboardView.timeGapDiagram}" 
                         styleClass="ui-diagram-layout" responsive="true" parent="timegapdatagrid" binding="timegapdatagrid"/>      
                </p:panel>
         </p:dataGrid>

private void createTimeGapDiaLineModels(JourneyDTO journeyDTO) {
        dashboardView.getTimeGapDiagram().clear();
        List<TouchPointDTO> tplist = getTouchPointList(journeyDTO);
        ChartSeries cs;
        String a1=null;
        int b1=0;
        Map<String, ChartSeries> mapcs = new HashMap<>();

        TouchPointFieldResearcherListDTO touchPointFieldResearcherDTOList = journeyService.getTouchPointFiedlResearcherListOfJourney(journeyDTO);
        for (int i = 0; i<tplist.size(); i++){
            cs = new ChartSeries();
            String n1 = tplist.get(i).getTouchPointDesc();
            cs.setLabel(n1);
            for (int j=0; j<touchPointFieldResearcherDTOList.getTouchPointFieldResearcherDTOList().size(); j++){
                if (touchPointFieldResearcherDTOList.getTouchPointFieldResearcherDTOList().get(j).getTouchpointDTO().getTouchPointDesc().equals(tplist.get(i).getTouchPointDesc()))
                {
                    a1= touchPointFieldResearcherDTOList.getTouchPointFieldResearcherDTOList().get(j).getFieldResearcherDTO().getSdtUserDTO().getUsername();
                    System.out.println(touchPointFieldResearcherDTOList.getTouchPointFieldResearcherDTOList().get(j).getFieldResearcherDTO().getSdtUserDTO().getUsername());
                    System.out.println(touchPointFieldResearcherDTOList.getTouchPointFieldResearcherDTOList().get(j).getDuration());

                    if (touchPointFieldResearcherDTOList.getTouchPointFieldResearcherDTOList().get(j).getDuration()==null){
                        System.out.println("here");
                        b1=0;  
                    }else {
                        b1 = touchPointFieldResearcherDTOList.getTouchPointFieldResearcherDTOList().get(j).getDuration();
                    }
                }
                cs.set(a1,b1);
                }
            mapcs.put(n1, cs);
            }

            //dashboardView.getTimeGapDiagram().addSeries(cs);

        for (Map.Entry<String, ChartSeries> mapChartSeries : mapcs.entrySet()) {   
            System.out.println(mapChartSeries.getValue().getLabel());

            System.out.println(mapChartSeries.getValue().getData());
            dashboardView.getTimeGapDiagram().addSeries(mapChartSeries.getValue());
    }
    }

如果我能就上述问题得到一些帮助，那将会很有帮助。

动态创建多个条形图

0 个答案: