Question

我想知道是否可以在数据表的每一行的列中使用饼图，以及如何在JSF2.2中使用primefaces showcase执行它：

https://primefaces.org/showcase/ui/chart/pie.xhtml

我的想法是将100％的饼图显示为基于id的颜色到网格中每一行和一个描述。

1.blue 2.yellow 3.red。等...

我从展示中尝试下面的基本代码没有成功，我没有找到任何类似的例子。我的xhtml工作正常，但是当我添加饼图时出错。

@ManagedBean(name = "info")
@ViewScoped

public class InfoView implements java.io.Serializable {


@ManagedProperty(value = "#{infoBo}")
private InfoBo infoBo;

private Long id;
private String description; 

private List<Info> listInfo;
private InfoDataModel infoDataModel;    
private Info infoSelected;

private PieChartModel pieModel1;    

 @PostConstruct
public void init() {
    createPieModels();
}

public PieChartModel getPieModel1() {
    return pieModel1;
}

private void createPieModel() {
    createPieModel1();        
}

private void createPieModel1() {
    pieModel1 = new PieChartModel();         
    pieModel1.set("Blue", 100);                 
    pieModel1.setTitle("Blue Simple Pie");
    pieModel1.setLegendPosition("w");
    pieModel1.setShowDataLabels(true);
    pieModel1.setDiameter(150);
}

public getters & setters {

}

查看xhtlm：

<p:dataTable id="datatableInfo" var="varInfo" value="#{Info.infoDataModel}" widgetVar="wdatatableInfo" style="width: 98%"                                             
         paginator="true" paginatorPosition="bottom" rows="10" rowsPerPageTemplate="10,20,30,40,50"                                             
         paginatorTemplate="{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink}"                                             
         selectionMode="single" tableStyle="table-layout:fixed;width:120" >


         <p:column id="id_Reg" headerText="ID" style="width: 2%" sortBy="#{varInfo.id}" >                                    
                <h:outputText value="#{varInfo.idReg}"/>
         </p:column>

         <p:column id="id_description" headerText="Description" style="width: 10%" >             
                <h:outputText value="#{varInfo.description}"/>
         </p:column>

    <p:column id="id_chart" headerText="Chart" style="width: 80%" >             
                <p:chart type="pie" model="#{varInfo.pieModel1}" style="width:40px;height:30px" />
        </p:column>

感谢。

Answer 1

它工作正常，图表只显示（在我的应用程序中）与pieModel1.setLegendPosition（＆＃34; s＆＃34;）

如何在带有数据表的每一行的列中使用p：chart

1 个答案: