Tutorial: Ext-JS Charting and Mapping with Google Visualizations

in Ext JS,Tutorials

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.

Tagged as: Data, Ext JS, Google, JavaScript, Library, LinkedIn, Tutorials, Visualization

Leave a Comment

{ 7 comments… read them below or add one }

Aaron Conran October 14, 2008 at 10:50

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'}

claude October 14, 2008 at 18:57

Thanks Aaron. I have updated the tutorial.

Veerendra November 19, 2008 at 14:31

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

Thanks.

claude November 19, 2008 at 14:38

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

Mauricio December 5, 2008 at 11:15

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?

claude December 5, 2008 at 11:41

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

Manuel June 23, 2010 at 12:26

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

Previous post:

Next post: