Custom charts using visualforce page

To generate custom charts by using visualforce page, just go through this simple demo:

//Visualforce code:

<apex:page controller=”PieChartController” title=”Pie Chart”>
<apex:chart height=”350″ width=”450″ data=”{!pieData}”>
<apex:pieSeries dataField=”data” labelField=”name”/>
<apex:legend position=”right”/>

// Apex controller code

public class PieChartController {
public List<PieChartData> getPieData() {
List<PieChartData> data = new List<PieChartData>();
data.add(new PieChartData(‘SUN’, 30));
data.add(new PieChartData(‘MON’, 15));
data.add(new PieChartData(‘TUE’, 10));
data.add(new PieChartData(‘WED’, 20));
data.add(new PieChartData(‘THU’, 18));
data.add(new PieChartData(‘FRI’, 8));
data.add(new PieChartData(‘SAT’, 10));
return data;
// Wrapper class
public class PieChartData {
public String name { get; set; }
public Integer data { get; set; }
public PieChartData(String name, Integer data) { = name; = data;
//Output for this demo
Chart Demo output

One Comments

Comments are closed.

Need more help?

Hi there, was your problem or query resolved? If not & need more assistance, please do reach out to us at, we'll be more than delighted to help. Nanostuffs has 7+ years of extensive Salesforce & iOS/Android experience.
Holler Box