I was inspired by Sam Arjmandi’s post about embedding Google Charts into VisualForce pages. I have a use case that requires a little different approach. I needed to get a quick view of the Campaign Member Statuses for a Campaign. I went ahead and started with Sam’s example and tweaked it for my purpose. Here’s the result!

It’s an embedded VisualForce component in the Results section of my Campaign page. It shows a quick count for each Member Status that is being used. To get it going in your org, here’s what you need.

VisualForce Page

It’s a simple page containing 1 DIV so that I can set the background color to match that of a Page Layout. Other than that it’s just an image returned from Google Charts. There is a lot of flexibility with Google Charts. Therefore, I made it so most of the URL can be tweaked in VisualForce. Only the data values and its labels come from the controller. This is nice because you can edit VF in a production org, but you can’t edit Apex. This will let you change things like width, height, chart colors, chart type, etc.

Apex Controller
The controller is an extension of the Campaign standard controller. This is so the VisualForce page becomes an option to include on a Campaign Page Layout. The method that does all the work is getChartData. It gets the available Campaign Member Statuses and then queries the Campaign Member object for that Campaign and adds a data/label value for each one. It then returns a query string that you include into the Image src on the Visual Force page.

I am bad at Test classes, but there is 1 in there that passes and should be good enough. This functionality is pretty harmless.

Page Layout
When you add it to the Page Layout, make the height of the component the same as the height you specified in the VF page’s image src for Google Charts. In this example, it’s 125. Doing this will ensure the background colors match your Page Layout.

Brett Kahnke Said,

Wow, very nice. It looks like you’ll only hit the 10000 limit if any one Status value has over 10,000. Is that right? If so, you can probably just add “limit 10000” to the query and inform users that there is a cap for any one value. Probably only affects the initial Sent (or equivalent) status.