VISUAL FORCE
INTEGRATEDLINE AND BAR CHART: Visual force pages can be used for Charting
also. The following VF
page uses a custom controller “LineAndBarController” and is used to create an
integrated line and bar chart for
Revenue per Month and Opportunities Closed per month.
Here
the Line shows the Opportunities Closed and the Bar shows the Revenue per month
in the year 2011.
VisualForce
Page:
<apex:page
controller="LineAndBarController" showHeader="false"
readOnly="true">
<apex:chart width="600"
height="275" data="{!data}">
<apex:axis
type="Numeric" position="left"
fields="numOppsClosedWon"
title="Opportunities
Closed" grid="true"/>
<apex:axis
type="Numeric" position="right"
fields="monthlyRevenue"
title="Revenue
(US$)"/>
<apex:axis
type="Category" position="bottom"
fields="theMonth"
title="2011">
</apex:axis>
<apex:barSeries
title="Monthly Sales" orientation="vertical"
axis="right"
xField="theMonth" yField="monthlyRevenue"/>
<apex:lineSeries
title="Closed-Won"
axis="left"
xField="theMonth" yField="numOppsClosedWon"
markerType="circle"
markerSize="4" markerFill="#00FF00"/>
</apex:chart>
</apex:page>
Controller
Class:
public with sharing class LineAndBarController
{
public
List<AggregateResult> getData() {
return
[SELECT
SUM(Amount) monthlyRevenue, COUNT(Name) numOppsClosedWon,
CALENDAR_MONTH(CloseDate)
theMonth
FROM
Opportunity
WHERE
stageName = 'Closed Won' AND CALENDAR_YEAR(CloseDate) = 2011
GROUP
BY CALENDAR_MONTH(CloseDate)
ORDER
BY CALENDAR_MONTH(CloseDate)];
}
}
