logo

Using Google Charts API With Lotus Domino

I just updated the DEXT survey demos to include a graphical image of a pie chart, rather than the amateurish bar charts created with CSS. You can see an example here:

image

Looks good doesn't it. Wondering how complicated it was to do? Be surprised if I said it was very, very simple?

Earlier on today I Tweeted about how much I was liking the ASP.NET's built-in Chart component for creating charts on the fly. In reply my wife's friend's husband suggested I look at the Google Chart API, which is what I've used to create the charts above.

So simple it hurts.

I won't bother with a "how to" as it's very simple and well documented on the Google Charts site I just linked to.

Obviously it's a simple way to add a chart to a page generated with any server, so why did I add Lotus Domino to this blog's title? To keep the people who voted "no" in the this survey :-)

At some point soon I'm planning on adding the surveys to this site itself. I'll use the Google charts when I do.

Comments

  1. What would be cool is if there were a bunch of reusable XPage controls that utilizes this API and you can bind to Notes/Domino data.

      • avatar
      • Steve Smillie
      • Thu 28 Oct 2010 11:56 AM

      Bob,

      That would be great. I considered trying to do that with the Dojo charting but never have had the chance.

  2. Dojo charting give you those capabilities also.

    1. Without having to make a round trip to google to get your chart; however the dojo ones don't look quite as good.

      Show the rest of this thread

      • avatar
      • Jake Howlett
      • Fri 29 Oct 2010 02:19 AM

      Forgive my ignorance of all things Dojo but how does it do it? It's a JS framework, so how does it build images - does it use SVG/canvas?

      Show the rest of this thread

  3. Bruce,

    True. But it is improving.

  4. Thanks Jake, very useful

    As for the relevance to Domino - well just create an xPage with an image and compute the URL for the image.

    As a two-minute test my image url was grabbed from the Google wizard then split up like this:

    var baseURL = "http://chart.apis.google.com/chart?" ;

    var chartstyle = "chxt=x,y,r,t&chs=300x150&cht=bhs&chco=3D7930,A2C180" ;

    var axis1 = "32.787,57.377,34.426,75.41" ;

    var axis2 = "19.672,9.836,26.23,16.393" ;

    baseURL + chartstyle + "&chd=t:" + axis1 + "|" + axis2 ;

    The axis numbers could very easily be replace by @dbcolumn / @dblookup

    Of course I look forward to someone building a re-useable control as discussed above, but it's pretty easy to get started now (much easier than Dojo charts).

    • avatar
    • Jyotiprakash
    • Thu 28 Oct 2010 11:04 PM

    You are the Best.

    • avatar
    • Rishi
    • Thu 28 Oct 2010 11:44 PM

    I prefer flash based charts.. Fusion charts are great , you can download most of the frequently used charts for free.

    • avatar
    • Jas
    • Fri 29 Oct 2010 02:03 AM

    Should see High Charts - http://www.highcharts.com/ - is js based, no reliance on flash, etc.

  5. It's a good choice but there are drawbacks :

    - data security

    - accesibility

    I love the Google-O-Meter Charts , I don't know another tool that provides that.

      • avatar
      • Jake Howlett
      • Fri 29 Oct 2010 02:49 AM

      Indeed. As with any tool, you have to use best judgement. For the actual app I'm working on I wouldn't use it, as it needs to be secure. For this site's surveys it's perfectly fine.

    • avatar
    • PaulG
    • Fri 29 Oct 2010 04:09 AM

    One recent update for FusionCharts that seems to be very good - is a dynamic use of HTML5 - so they work on iPhone/iPad etc without needing to build additional fallover options in.

    1. oooh

    • avatar
    • Mitul
    • Fri 29 Oct 2010 08:01 AM

    Hi Jake,

    We like them as you can get a proof of concept up and running in next to no time - without having to mess about with any third party components.

    We're quite happy with how Google Charts performs, we use it heavily on some BI dashboards. We've also built a wrapper control which allows us to just pass it a chart type along with all the collections of data and the control handles building the querystring itself for the image src itself.

    Combine this with jQuery and you have a fairly flexible way of creating charts and updating them asynchronously.

    Like you say it's choosing the right tool for the job - but not a bad path to go down all the same.

    Mitul

    (wife's friend's husband :)

  6. Jake,

    Dojo using SVG. It is not as good as the Google Chart yet, but it is getting better.

Your Comments

Name:
E-mail:
(optional)
Website:
(optional)
Comment:


About This Page

Written by Jake Howlett on Thu 28 Oct 2010

Share This Page

# ( ) '

Comments

The most recent comments added:

Skip to the comments or add your own.

You can subscribe to an individual RSS feed of comments on this entry.

Let's Get Social


About This Website

CodeStore is all about web development. Concentrating on Lotus Domino, ASP.NET, Flex, SharePoint and all things internet.

Your host is Jake Howlett who runs his own web development company called Rockall Design and is always on the lookout for new and interesting work to do.

You can find me on Twitter and on Linked In.

Read more about this site »

More Content