Note: This release is in preview. Features described here don’t become generally available until the latest general availability date that Salesforce announces for this release. Before then, and where features are noted as beta, pilot, or developer preview, we can’t guarantee general availability within any particular time frame or at all. Make your purchase decisions only on the basis of generally available products and features.

Create Visualforce Dashboard Components

Use Visualforce pages as dashboard components. A dashboard shows data from source reports as visual components, such as charts, gauges, tables, metrics, or Visualforce pages. The components provide a snapshot of key metrics and performance indicators. Each dashboard can have up to 20 components.

Available in: Salesforce Classic (not available in all orgs)

Available in: all editions

Visualforce pages as dashboard components are only available in Salesforce Classic. In Lightning Experience, you can create a custom tab and use that as a dashboard for your custom lightning components.

To be included in a dashboard, a Visualforce page must use a custom controller, use a standard or custom list controller, or not have a controller. You can’t add a Visualforce page with a standard controller to a dashboard. Only Visualforce pages that meet these requirements appear as options in the Data Sources tab.

Visualforce dashboard components aren’t supported when third-party cookies are disabled. See Visualforce Limitations in Salesforce Classic When Third-Party Cookies are Blocked.

Note

Create a Visualforce page called VFDashboard.

The Visualforce page uses a standard list controller, so you can add it to a dashboard. It displays a list of the cases associated with your org.

1<apex:page standardController="Case" recordSetvar="cases">
2    <apex:pageBlock>
3        <apex:form id="theForm">
4            <apex:panelGrid columns="2">
5                <apex:outputLabel value="View:"/>
6                <apex:selectList value="{!filterId}" size="1">
7                    <apex:actionSupport event="onchange" rerender="list"/>
8                    <apex:selectOptions value="{!listviewoptions}"/>
9                </apex:selectList>
10            </apex:panelGrid>
11            <apex:pageBlockSection>
12                <apex:dataList var="c" value="{!cases}" id="list">
13                {!c.subject}
14                </apex:dataList>
15            </apex:pageBlockSection>
16        </apex:form>
17    </apex:pageBlock>
18</apex:page>

Build a Salesforce Classic dashboard.
Add the Visualforce page to a dashboard.
1. Click the Dashboards tab.
2. On the dashboard where you want to add the Visualforce page component, click Edit.
3. From the Components tab, drag Visualforce Page onto your dashboard.
4. From the Data Sources tab, click the Visualforce Pages dropdown, and drag VFDashboard onto the component that you just added to the dashboard.
5. Optionally, enter a header or footer to display on the Visualforce dashboard component.
6. Save your changes.
For a more complex example that uses a custom list controller, see Create Advanced Visualforce Dashboard Components.

Visualforce Developer Guide

Create Visualforce Dashboard Components

See Also