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>
そして、これが私のBeanです。
@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:
Firebug:
<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>
生成されたHTMLソースをfirebugで調べると、上記のコードが生成されますが、ブラウザーには何も表示されません。