Pie Chart does not render

jgenchik · 05 Feb 2010, 20:58

I am trying to create a simple pie chart, but it is not rendering anything. The code is very simple. Am I missing something?

XHTML:

Code: Select all

<?xml version="1.0" encoding="ISO-8859-1" ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.prime.com.tr/ui">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
	<title>Insert title here</title>
</head>

<body>

<ui:composition template="/headerContentLayout.xhtml">

	<ui:define name="content">
		<h:messages styleClass="errorMessage" infoClass="infoMessage" showSummary="true" showDetail="true" globalOnly="true" />
		
		<h:form id="chartsForm" prependId="false">
			<h:panelGrid id="chartsGrid" columns="2" border="0" columnClasses="panelLabelColumn r, panelDataColumn l">
				<h:outputText value="Simple chart: " />
				<p:pieChart id="simpleChart" value="#{chartsBean.widgets}" var="widget" categoryField="#{widget.name}" dataField="#{widget.quantity}" /> 
			</h:panelGrid>
		</h:form>
		
		<h:outputStylesheet name="css/style.css" />
	</ui:define>
</ui:composition>

</body>
</html>

ManagedBean:

Code: Select all

import java.io.Serializable;
import java.util.ArrayList;
import java.util.List;

import javax.annotation.PostConstruct;
import javax.enterprise.context.SessionScoped;
import javax.inject.Named;

import org.apache.commons.logging.Log;
import org.apache.commons.logging.LogFactory;

@Named(value="chartsBean")
@SessionScoped
public class ChartsBean implements Serializable {
	private static final long serialVersionUID = 1L;
	private static final Log log = LogFactory.getLog(ChartsBean.class);
	
	private List<Widget> widgets = new ArrayList<Widget>();
	
	@SuppressWarnings("unused")
	@PostConstruct
	private void init(){
		log.info(" ************************* in ChartsBean.init");
		this.widgets.add(new Widget(1, "Widget 1", 100));
		this.widgets.add(new Widget(2, "Widget 2", 120));
		this.widgets.add(new Widget(3, "Widget 3", 150));
	}
	
	public String showCharts(){
		return "charts?faces-redirect=true";
	}
	

	public List<Widget> getWidgets() {
		return widgets;
	}
	public void setWidgets(List<Widget> widgets) {
		this.widgets = widgets;
	}
}

Object containing data:

Code: Select all

public class Widget implements Serializable {
	private static final long serialVersionUID = 1L;
	private long id;
	private String name;
	private long quantity;
	
	
	public Widget(){
		super();
	}
	
	public Widget(long id, String name, long quantity) {
		super();
		this.id = id;
		this.name = name;
		this.quantity = quantity;
	}

...
getters and setters

I would appreciate any suggestions you may have.

Thanks

jgenchik · 05 Feb 2010, 21:02

Correction: Just checked with FireFox and IE, and it works fine with those browsers. Does not work with the latest Chrome 4.0.249.78

05 Feb 2010, 21:21

You need to enforce contentType on webkit based browsers such as chrome and safari;

Code: Select all

<f:view contentType="text/html">
...
</f:view>

jgenchik · 05 Feb 2010, 22:36

That fixed it. Thank you. I retested all 3 browsers. looks fine.

06 Feb 2010, 12:32

Glad it works, this information is also in FAQ section in user's guide

Pie Chart does not render

Who is online