1

我正在尝试使用 Primefaces 实现条形图(在 Pom.xml 中,我具有 Primefaces 4.0 的依赖项),但是在运行应用程序时,屏幕上没有显示任何内容,但选择检查元素会出现<div id="stacked">和脚本,但什么也没有更多的。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//ES"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.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:p="http://primefaces.org/ui" lang="es">
<f:view contentType="text/html">
    <h:head>
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
        <meta HTTP-EQUIV="refresh" content="1803"/>
        <title>Sistema de Seguimientos de Ciclos de Calidad</title>
        <meta name="description" content=""/>
        <meta name="viewport" content="width=device-width, initial-scale=1"/>
        <link href="/sistema.ciclos.calidad/resources/css/estilo.css" media="screen" rel="stylesheet" type="text/css" />

    </h:head>
    <h:body link="#000033">
            <div id="frame" >
                 <h:form>
                    <p:barChart id="stacked" value="#{grafico.categoryModel}" legendPosition="ne" style="height:300px"
                                title="Stacked Bar Chart" stacked="true" barMargin="50" min="0" max="300"/>
                 </h:form>
            </div>

    </h:body>
</f:view>
</html>

被调用的bean如下:

import org.primefaces.model.chart.CartesianChartModel;
import org.primefaces.model.chart.ChartSeries;


import javax.annotation.PostConstruct;
import javax.faces.bean.ManagedBean;
import javax.faces.bean.ViewScoped;
import java.io.Serializable;


@ManagedBean(name = "grafico")
@ViewScoped
public class Chart implements Serializable {

    private CartesianChartModel categoryModel;

    @PostConstruct
    public void init(){
        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;
    }

}
4

2 回答 2

2

我刚刚遇到了同样的问题。

我发现不一定是 jquery 的版本是问题的根源。似乎它<p:barChart>本身不包含所需的 jquery 脚本。

在我向<p:dataTable>页面添加 a 后,图表再次显示,即使它只是没有呈现 ( <p:dataTable rendered="false" />)。

<p:dataTable>分别比较使用和不使用假人的渲染结果时,我注意到<p:dataTable>强制以下内容包含在<head>

<link type="text/css" rel="stylesheet" href="/banking/faces/javax.faces.resource/primefaces.css?ln=primefaces&amp;v=4.0" />
<script type="text/javascript" src="/banking/faces/javax.faces.resource/jquery/jquery-plugins.js?ln=primefaces&amp;v=4.0"></script>

因此,我认为这是一个错误<p:barChart>,它只是错过了包含。

于 2013-11-16T12:42:41.197 回答
0

从 3.5 切换到 4 后我遇到了同样的问题

我记得,问题是与 primefaces 4 中使用的 jquery 版本相关的 javascript 错误我已将 primefaces 4 jar 中的 jquery.js 文件替换为 primefaces 3.5 jar 中的文件并解决了该问题

primefaces jar 中 jquery.js 文件的位置是

META-INF\resources\primefaces\jquery

于 2013-11-06T10:00:53.737 回答