Tutorial: Ext-JS Charting and Mapping with Google Visualizations

Aaron Conran posted an entry about Ext.ux.GVisualizationPanel, a user extension that takes advantage of the similarities between the Ext data store and Google’s data table to allow reuse of an Ext data store with Google’s Visualization API.

Proceed to the tutorial.

Claude is as a solutions architect at a unified communications company. He also helps small businesses increase their productivity, improve back-office processes and reduce costs by promoting the use of new technologies.
This entry was posted in Ext JS, Tutorials and tagged , , , , , , , . Bookmark the permalink.

7 Responses to Tutorial: Ext-JS Charting and Mapping with Google Visualizations

  1. Claude -

    Great use of the extension! :)

    I just wanted to comment and let you know that you actually don’t have to modify the source of GVisualizationPanel.js to use the annotatedtimeline visualization. You can pass in an object literal with the pkg name as the key and the value as the class name. Like this:

    visualizationPkg: {'annotatedtimeline':'AnnotatedTimeLine'}

  2. claude says:

    Thanks Aaron. I have updated the tutorial.

  3. Veerendra says:

    I followed your tutorial above but was unable to see any output.Could you please what might have gone wrong with above tutorial?

    Thanks.

  4. claude says:

    @ Veerendra: Do you have a site we can look at?

  5. Mauricio says:

    Thanks for the tutorial. I was able to run your code without difficulties.
    In my case, I have a ‘card’ layout with a chart in each card. Each card is of xtype ‘gvisualization’. I must be doing something wrong as GVisualizationPanel is complaininng in line 105 which I guess means that the is not ready.

    Any hints?

  6. claude says:

    @Mauricio: Do you have a link we can look at? If not, email me your code and I will take a look.

  7. Manuel says:

    Hi,

    I know this post is a bit old but I just saw it.

    I have problem extending visualizationPkgs, I want to use Geomap chart but when using ‘geomap’: ‘GeoMap’, doesn’t work. Do you know how to do this?

    Thanx, and nice post

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>