Question

我正在尝试这个primefaces饼图的例子https://www.primefaces.org/showcase/ui/chart/pie.xhtml 但我得到一个空白页面，我尝试了许多解决方案，如添加但仍然无法工作..请帮助！

Bean：

package com.levelup;

import javax.annotation.PostConstruct;
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import org.primefaces.model.chart.PieChartModel;

@ManagedBean
public class ChartView implements Serializable {
    private static final long serialVersionUID = 1L;
    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("Brand 1", 540);
        pieModel1.set("Brand 2", 325);
        pieModel1.set("Brand 3", 702);
        pieModel1.set("Brand 4", 421);

        pieModel1.setTitle("Simple Pie");
        pieModel1.setLegendPosition("w");
    }

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

        pieModel2.set("Brand 1", 540);
        pieModel2.set("Brand 2", 325);
        pieModel2.set("Brand 3", 702);
        pieModel2.set("Brand 4", 421);

        pieModel2.setTitle("Custom Pie");
        pieModel2.setLegendPosition("e");
        pieModel2.setFill(false);
        pieModel2.setShowDataLabels(true);
        pieModel2.setDiameter(150);
    }

}

xhtml：

<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:p="http://primefaces.org/ui">

     <h:head>

     </h:head>

     <h:body>
 <div>
 <p:panel>
         <p:chart type="pie" model="#{ChartView.pieModel1}" style="width:400px;height:300px"  />

<p:chart type="pie" model="#{ChartView.pieModel2}" style="width:400px;height:300px" />
</p:panel>
 </div>
     </h:body>

<script> $.noConflict(); </script>
</html>

Answer 1

1）您可以检查模型是否在创建方法结束时有数据。

2）您可以尝试将图表组件放在表单元素中。

Primefaces图表不会出现

1 个答案: