function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Brooks Johnson 6Brooks Johnson 6 

Visualforce Pie Chart With Labels That Are Different Than the Legend

Is it possible to create a pie chart in VF  with slice labels that are different from the legend? In this chart I would like the labels to be the actual numbers and the legend to be text.  A pie wedge would have a label of 4% but the legend would say "Percent Opened" for example. 

Here is the page
<apex:page controller="CampaignPieChartController" title="Campaign Metrics" lightningStylesheets="true">
    <div class="slds-align_absolute-center">
        <apex:chart height="300" width="300" data="{!pieData}" resizable="true">
            <apex:legend position="right" font="14px Helvetica"/>
            <apex:pieSeries dataField="data" labelField="name"
                            colorSet="#008CC3,#F0B428,#B42846" donut="60">
                <apex:chartLabel display="middle" font="bold 14px Helvetica" orientation="vertical"/>

Here is the controller

public without sharing class CampaignPieChartController {
	Id recId = ApexPages.currentPage().getParameters().get('Id');
	public List<PieWedgeData> getPieData()
		List<PieWedgeData> data = new List<PieWedgeData>();
		List<Campaign> campaigns = new List<Campaign>();
		String sql = 'SELECT Emails_Delivered__c, Total_Opens__c, Total_Clicks__c FROM Campaign WHERE Campaign.Id =: recId';
		campaigns = Database.Query(sql);
		for(Campaign temp :campaigns)
			data.add(new PieWedgeData('Delivered', temp.Emails_Delivered__c));
			data.add(new PieWedgeData('Opens', temp.Total_Opens__c));
			data.add(new PieWedgeData('Clicks', temp.Total_Clicks__c));
		return data;
	// Wrapper class
	public class PieWedgeData
		public String name { get; set; }
		public Decimal data { get; set; }
		public PieWedgeData(String name, Decimal data)
		{ = name; = data;


Alain CabonAlain Cabon

You probably need something like <apex:chartTips>

apex:chartTips Defines tooltips which appear on mouseover of data series elements. This component offers more configuration options than the default tooltips displayed by setting the tips attribute of a data series component to true.
Note: This component must be enclosed by a data series component.

but the sample of the documentation is too simple (doesn't use labelField nor valueField).