当包含在其他页面中时,PrimeFaces图表不可见

时间:2018-10-20 12:28:15

标签: jsf charts primefaces render

JSF的新手,但我了解其生命周期。我正在使用JSF 2.2,Primefaces 6.1。我分别在名为bDashboard.xhtml的xhtml页面中创建了布局。直接调用时效果很好。但是,当我通过<ui:include src="/bDashboard.xhtml" />将其包括在其他页面中时,则不会呈现图表。这是仪表板文件:

<ui:composition  
xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:a="http://xmlns.jcp.org/jsf" 
xmlns:p="http://primefaces.org/ui"
xmlns:pt="http://xmlns.jcp.org/jsf/passthrough"
xmlns:c="http://xmlns.jcp.org/jsp/jstl/core"
xmlns:ct="http://www.chartistjsf.org/charts"
xmlns:ui="http://java.sun.com/jsf/facelets">


<h3>My Dashboard</h3>
<p:panelGrid columns="2" layout="grid">
    <p:panel>
        <p:chart type="pie" model="#{pieChartBean.pieModel1}"
            style="display:block;margin-right:auto;margin-left:auto;" />
    </p:panel>
    <p:panel>
        <p:chart type="pie" model="#{pieChartBean.pieModel2}" visible="true"
            style="display:block;margin-right:auto;margin-left:auto;" />
    </p:panel>
  </p:panelGrid>
</ui:composition>

因此包含了上述文件:

<h:form id="buyerDashForm">
            <ui:include src="/bDashboard.xhtml" />
</h:form>

Piechart托管豆:

@ManagedBean
@SessionScoped
public class PieChartBean {
    private PieChartModel pieModel1;
    private PieChartModel pieModel2;

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

public PieChartModel getPieModel1() {
    return pieModel1;
}

public PieChartModel getPieModel2() {
    return pieModel2;
}

private void createPieModels() {
    createPieModel1();
    createPieModel2();
}

private void createPieModel1() {
    pieModel1 = new PieChartModel();

    pieModel1.set("Kajaria Builders", 540);
    pieModel1.set("Bajaj Constructions", 325);
    pieModel1.set("Sentinel Builders", 702);
    pieModel1.set("Regency Towers", 421);

    pieModel1.setTitle("Savings By Project");
    pieModel1.setLegendPosition("w");
    pieModel1.setShadow(false);
}

private void createPieModel2() {
    pieModel2 = new PieChartModel();

    pieModel2.set("Kajaria Builders", 50);
    pieModel2.set("Bajaj Constructions", 35);
    pieModel2.set("Sentinel Builders", 72);
    pieModel2.set("Regency Towers", 41);


    pieModel2.setTitle("Savings By Spend Category");
    pieModel2.setLegendPosition("e");
    pieModel2.setShowDataLabels(true);
    pieModel2.setShadow(false);
}

呈现页面时我没有收到错误。

1 个答案:

答案 0 :(得分:0)

我相信图表组件也可以在primeface 6.1中使用。 我运行了您发布的上述代码片段,包括.xhtml模板,在这里效果很好。

->我从.xhtml文件中删除了visible = true。
->还要确保ui:include

中指定的模板文件的位置

我的pom.xml看起来像这样

    <dependency>
        <groupId>org.primefaces</groupId>
        <artifactId>primefaces</artifactId>
        <version>6.1</version>
    </dependency>

    <!-- JSF -->
    <dependency>
        <groupId>com.sun.faces</groupId>
        <artifactId>jsf-api</artifactId>
        <version>2.2.6</version>
    </dependency>
    <dependency>
        <groupId>com.sun.faces</groupId>
        <artifactId>jsf-impl</artifactId>
        <version>2.2.6</version>
    </dependency>

下面是输出 enter image description here