2

I'm not exactly sure how to map the "data" field of the apex:chart component. I created a simple test class but it's not showing the chart at all. I'm really scratching my head here because this is pretty basic stuff.

Apex Class

public with sharing class testPage {

    public List<Interaction__c> getInts(){

        List<oInteraction__c> i = [Select Id, Product__c from Interaction__c];
        return i;
    }

}

VF Page:

<apex:page controller="testPage">
    <apex:form >
    <apex:outputPanel id="section">
        <div class="wi-gen shado gr">
            <div class="marged">
                <h1 class="header">My Interactions By Product</h1>
            </div>          
            <apex:outputPanel id="chart">           
                <div class="marged ver2">
                    <apex:chart id="mainChart" data="{!ints}" height="2000" width="2000" background="#F5F5F5">
                        <apex:legend position="right"/>
                        <apex:pieSeries labelField="Product__c" dataField="Product__c" donut="50"/>
                    </apex:chart>
                </div>
            </apex:outputPanel>
        </div>
    </apex:outputPanel>
    </apex:form>
</apex:page>

The Firebug error message suggests that ints is not being picked up:

Visualforce Chart: Error loading configuration for chart 'jid0jid4mainChart': Did not find required field 'Product__c' in data for chart 'jid0jid4mainChart'. Make sure field was queried and/or provided and has a value.

2
  • What is the data type of the Product__c field. It would have to be a number for it to be able to plot as as a slice of the pi. You may have to aggregate data into a wrapper class if it is not numerical. salesforce.com/us/developer/docs/pages/Content/… Oct 25, 2012 at 17:44
  • Yes, you're right. I looked through a lot of the documentation on charting but didn't get to that one. I wish it was all in one place.
    – George S.
    Oct 25, 2012 at 18:44

1 Answer 1

9

When you are using VF Charting - all your data has to be coming from your Data="" attribute.

So with your example it's looking for a reference of "Product__c" within your INTS list.

One method to do this is to create a wrapper class. the class will contain all the points you need. An example:

public static List<Data> getChartData() {
        List<Data> data = new List<Data>();
        data.add(new Data('Jan', 30, 90, 55));
        data.add(new Data('Feb', 44, 15, 65));
        data.add(new Data('Mar', 25, 32, 75));
        data.add(new Data('Apr', 74, 28, 85));
        data.add(new Data('May', 65, 51, 95));
        data.add(new Data('Jun', 33, 45, 99));
        data.add(new Data('Jul', 92, 82, 30));
        data.add(new Data('Aug', 87, 73, 45));
        data.add(new Data('Sep', 34, 65, 55));
        data.add(new Data('Oct', 78, 66, 56));
        data.add(new Data('Nov', 80, 67, 53));
        data.add(new Data('Dec', 17, 70, 70));
        return data;
    }

    // Wrapper class 

    public class Data {
        public String name { get; set; }
        public Integer data1 { get; set; }
        public Integer data2 { get; set; }
        public Integer data3 { get; set; }
        public Data(String name, Integer data1, Integer data2, Integer data3) {
            this.name = name;
            this.data1 = data1;
            this.data2 = data2;
            this.data3 = data3;
        }
    }

You can find other examples here: http://www.salesforce.com/us/developer/docs/pages/Content/pages_charting_example.htm

Edit A second Example: http://blogs.developerforce.com/tech-pubs/2011/09/introducing-visualforce-charting.html

Anything you use needs to be able to display the Value and the Name. So you might be able to use AggregatedResult[] that's been grouped.

3
  • Do you have to do wrapper classes or could you in theory use aggregate queries if its a straightforward summarise on a field. Oct 25, 2012 at 17:56
  • You don't have to do a wrapper - but all the data needs to be available in the list you provide in the data= attribte. Oct 25, 2012 at 18:58
  • forgot to hit save on my last edit: You don't have to do a wrapper - but all the data needs to be available in the list you provide in the data= attribute. Here's an example that was done using Javascript to create the data array: verticalcode.wordpress.com/2012/10/24/… In your pie chart example though it has no idea what the label should be because it doesn't exist in your Ints list. Oct 25, 2012 at 19:25

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .