Pie Chart in salesforce

Use Case: 

Representing the value in pie chart format.

Solution:

To display the values in pie chart you want to first construct the data in the format of string and Integer in a Wrapper class then pass that list of the wrapper class to the apex:chart . Height , Width and data are required parameters in apex:chart.

In apex:pieSeries the labelField parameter should be the name of the string variable in Wrapper class and dataField parameter should be the name of the Integer value in the wrapper class. Both the parameter names should match properly otherwise the chart will not be displayed.

Controller and Page:

public class ChartDemo {
    
    //Method to send data to page
    public List<PieWrapper> getPieData(){
        //Wrapper list to return
        List<PieWrapper> pieWrapperList = new List<PieWrapper>();
        
        //Adding values to wraper list
        pieWrapperList.add(new PieWrapper('Value1',10));
        pieWrapperList.add(new PieWrapper('Value1',2));
        pieWrapperList.add(new PieWrapper('Value1',5));
        
        //Return the wrapper list
        return pieWrapperList;
    }
    
    //Wrapper class to construct data in required format
    public class PieWrapper{
        
        //Variables to hold value
        Public String name;
        Public Integer numValue;
        
        //Constructor
        public PieWrapper(String strValue , Integer intValue){
            name = strValue;
            numValue = intValue;         
        }
    }

}
<apex:page controller="ChartDemo">
    <apex:chart height="250" width="300" data="{!pieData}">
    	<apex:pieSeries labelField="name" dataField="numValue"/>
	</apex:chart>
</apex:page>

 

Screenshot:

image

 

Rating: 
No votes yet