我遇到barCharts的问题。 我为Primefaces的barCharts写了一个例子,但是在页面上它们是不可见的。
这里是Bean类:
import java.io.Serializable;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import org.primefaces.model.chart.CartesianChartModel;
import org.primefaces.model.chart.ChartSeries;
@ManagedBean
@ViewScoped
public class InvoiceStatisticsBean implements Serializable {
private CartesianChartModel categoryModel;
public InvoiceStatisticsBean() {
categoryModel = new CartesianChartModel();
ChartSeries boys = new ChartSeries();
boys.setLabel("Boys");
boys.set("2004", 120);
boys.set("2005", 100);
boys.set("2006", 44);
boys.set("2007", 150);
boys.set("2008", 25);
ChartSeries girls = new ChartSeries();
girls.setLabel("Girls");
girls.set("2004", 52);
girls.set("2005", 60);
girls.set("2006", 110);
girls.set("2007", 135);
girls.set("2008", 120);
categoryModel.addSeries(boys);
categoryModel.addSeries(girls);
}
public CartesianChartModel getCategoryModel() {
return categoryModel;
}
public void setCategoryModel(CartesianChartModel categoryModel) {
this.categoryModel = categoryModel;
}
}
这是.xhtml文件:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://xmlns.jcp.org/jsf/html"
xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<h:head>
<title>Invoice Statistics</title>
</h:head>
<h:body>
<ui:composition template="/templates/layout.xhtml">
<ui:define name="header">
<h1>Invoice Statistics</h1>
</ui:define>
<ui:define name="content">
<p>There should be a barChart</p>
<p:barChart id="horizontal" value="#{invoiceStatisticsBean.categoryModel}" legendPosition="se" style="height:300px" title="Horizontal Bar Chart" orientation="horizontal" min="0" max="200"/>
<p:outputPanel>test</p:outputPanel>
</ui:define>
</ui:composition>
</h:body>
</html>
很抱歉编辑错误,但这是我的第一个问题。
因此,如果我然后启动.xhtml页面,barChart的空间将保留在页面上,但它没有显示。
有人可以帮我解决这个问题吗?
答案 0 :(得分:1)
<p:panel>
<p:chart ......>
</p:panel>
应该修复它,p:panel
答案 1 :(得分:0)
ok primefaces 4.0就是问题。
使用3.5
中的一个从primefaces 4.0中交换jquery.js文件答案 2 :(得分:0)
如果您使用jquery使用模板,那么您应该添加此行
$ .noConflict();