# Providing Chart Data via a Controller Method

The most straightforward way to provide data to a chart is using a Visualforce expression that references a controller method. Simply reference the controller in the `<apex:chart>` `data` attribute.

On the server side, write a controller method that returns a List of objects, which can be your own Apex wrapper objects as in [A Simple Charting Example](/docs/platform/salesforce-pages-developers-guide/guide/pages-charting-overview-simple-example.md), sObjects, or `AggregateResult` objects. The method is evaluated server-side, and the results serialized to JSON. On the client, these results are used directly by `<apex:chart>`, with no further opportunity for processing.

To illustrate this technique with sObjects, here is a simple controller that returns a list of Opportunities, and a bar chart for their amounts:

```apex_code
public class OppsController {
    
    // Get a set of Opportunities
    public ApexPages.StandardSetController setCon {
        get {
            if(setCon == null) {
                setCon = new ApexPages.StandardSetController(Database.getQueryLocator(
                      [SELECT name, type, amount, closedate FROM Opportunity]));
                setCon.setPageSize(5);
            }
            return setCon;
        }
        set;
    }
    
    public List<Opportunity> getOpportunities() {
         return (List<Opportunity>) setCon.getRecords();
    }
}

```

```apex_page
<apex:page controller="OppsController">
    <apex:chart data="{!Opportunities}" width="600" height="400">
        <apex:axis type="Category" position="left" fields="Name" title="Opportunities"/>
        <apex:axis type="Numeric" position="bottom" fields="Amount" title="Amount"/>
        <apex:barSeries orientation="horizontal" axis="bottom" 
            xField="Name" yField="Amount"/>
    </apex:chart>
    <apex:dataTable value="{!Opportunities}" var="opp">
        <apex:column headerValue="Opportunity" value="{!opp.name}"/>
        <apex:column headerValue="Amount" value="{!opp.amount}"/>
    </apex:dataTable>
</apex:page>
```

![A horizontal bar chart from a List of sObjects](https://a.sfdcstatic.com/developer-website/sfdocs/platform/media/salesforce-pages-developers-guide/pages_charting_sobjects.png)

There are two important things to notice about this example:

- The Visualforce chart components access the data attributes from a List of Opportunity sObjects the same way as from the simple Data object used in [A Simple Charting Example](/docs/platform/salesforce-pages-developers-guide/guide/pages-charting-overview-simple-example.md).
- The object field names used as data attributes are case-sensitive in JavaScript while field names in Apex and Visualforce are case-**in**sensitive. Be careful to use the precise field name in the `fields`, `xField`, and `yField` attributes of axes and data series components, or your chart will silently fail.

**See Also**

- [Chart Data Format](/docs/platform/salesforce-pages-developers-guide/guide/pages-charting-overview-providing-data-format.md)
- [Refreshing Chart Data Using \<apex:actionSupport>](/docs/platform/salesforce-pages-developers-guide/guide/pages-charting-refreshing-data-actionsupport.md)