PrimeFaces饼图在JSF 2.0中不显示[重复]答案

【问题标题】：PrimeFaces pie chart is not displayed in JSF 2.0 [duplicate]PrimeFaces饼图在JSF 2.0中不显示[重复]
【发布时间】：2012-05-14 16:21:39
【问题描述】：

我想在我的 JSF 应用程序中显示 primefaces 饼图。

这是我的 xhtml 页面：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<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:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui">

<f:view contentType="text/html">
    <ui:include src="blocks/head.xhtml"/>

    <body>
    <ui:include src="blocks/header.xhtml"/>

        <p:pieChart id="sample"
                    value="#{pieChartBean.pieModel}"
                    legendPosition="w"
                    title="Sample Pie Chart"
                    style="width:400px;height:300px"/>

    <ui:include src="blocks/footer.xhtml"/>
    </body>
</f:view>
</HTML>

这是我的豆子：

@ManagedBean(name = "pieChartBean")
@ViewScoped
public class PieChartBean implements Serializable {

   private PieChartModel pieModel;

    public PieChartBean() {
        createPieModel();
    }

    public PieChartModel getPieModel() {
        return pieModel;
    }

    private void createPieModel() {
        pieModel = new PieChartModel();

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

}

我将 bean 放在 ViewScope 中，我还尝试了 Session 和 Request 范围。问题是图表没有显示在页面中。任何想法问题出在哪里？

编辑：奇怪的是，我试图在同一个 xhmtl 页面中添加一些其他组件，我添加了 <p:spinner/> 并且它有效。它显示在我的 JSF 页面中，但图表没有。

编辑 2：

萤火虫：

<div id="sample" style="width:400px;height:300px"></div>
<script id="sample_s" type="text/javascript">
$(function(){PrimeFaces.cw('PieChart','widget_sample',{id:'sample',data:[[["Brand 1",540],["Brand 2",325],["Brand 3",702],["Brand 4",421]]],title:'Sample Pie Chart',legend:{show:true,renderer: $.jqplot.EnhancedLegendRenderer,location:'w'},axes:{xaxis:{},yaxis:{}}},'charts');});
</script>

如果我用 firebug 浏览生成的 HTML 源代码，上面显示的代码会生成，但在浏览器中没有显示任何内容。

【问题讨论】：

您的代码似乎正确，这就是为什么我会尝试添加 , private static final long serialVersionUID = 1L;并且还会检查删除 (name = "pieChartBean") 是否有任何好处
没有成功。我尝试了你的两个建议。
您是否遇到任何异常，或者只是没有显示？
它只是没有显示，我添加了全局消息但没有显示任何类型的任何消息。
这是因为 primefaces 原生支持 jQuery。因此，如果您导入自己的 jQuery.js 文件，它将发生冲突。不需要导入jQuery，直接使用primefaces自带的即可。

标签： java jsf-2 primefaces

【解决方案1】：

你已经在 cmets 中告诉过你已经解决了这个问题，只是在回答中总结一下，这样就可以结束了：

问题是您导入了外部 jQuery.js 文件。

不要导入自己的jQuery库，它会和primefaces绑定的库冲突。然后使用jQuery 而不是$。
如果您使用的是旧版本的 primefaces（如 2.2.1），请查看此答案：jQuery conflict with primefaces

【讨论】：

【解决方案2】：

我有同样的问题，我尝试通过在 .xhtlm 中添加这一行来解决它

<h:head>
    <title>Graphe Prime Faces </title>
</h:head>

当我看到你的代码时，你和我有同样的错误，只需添加你的页面 .xhml 这个

编码将在您的浏览器中显示 shart pie

【讨论】：

【解决方案3】：

尝试将标签“p:pieChart”放入面板标签p:panel

                <p:panel>
                <p:pieChart id="sample"
                value="#{pieChartBean.pieModel}"
                legendPosition="w"
                title="Sample Pie Chart"
                style="width:400px;height:300px"/>
                </p:panel>

这对我有用。

【讨论】：