Below is the complete code, and the missing link would be a "table -> geomap" and a "orgchart -> geomap"
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http:// www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml";> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/ > <title>event interaction</title> <script type="text/javascript" src="http://www.google.com/jsapi";></ script> <script type="text/javascript"> google.load('visualization', '1', {packages: ['orgchart', 'table', 'geomap']}); function drawIt() { //setting data variables var data = new google.visualization.DataTable(); data.addRows(3); data.addColumn('string', 'Country'); data.addColumn('number', 'Popularity'); data.setCell(0, 0, 'Germany'); data.setCell(0, 1, 300); data.setCell(1, 0, 'United States'); data.setCell(1, 1, 300); data.setCell(2, 0, 'Spain'); data.setCell(2, 1, 300); //seeting geomap values var options = {}; options['dataMode'] = 'regions'; //drawing the visualizations var geomap = new google.visualization.GeoMap (document.getElementById('map_canvas')); geomap.draw(data, options); var orgchart = new google.visualization.OrgChart (document.getElementById('orgchart')); orgchart.draw(data, null); var table = new google.visualization.Table (document.getElementById('table')); table.draw(data, {showRowNumber: true}); //table.draw(data, null); //table -> orgchart google.visualization.events.addListener(table, 'select', function () { orgchart.setSelection(table.getSelection()); }); //orgchart -> table google.visualization.events.addListener(orgchart, 'select', function() { table.setSelection(orgchart.getSelection()); //alert(data.getValue(table.getSelection()[0].row,0)); }); //geomap -> table google.visualization.events.addListener(geomap, 'select', function() { table.setSelection(geomap.getSelection()); orgchart.setSelection(geomap.getSelection()); //alert(data.getValue(geomap.getSelection()[0].row,0)); //var row = geomap.getSelection()[0].row; //var country = data.getValue(row, 0); //alert(country); }); } google.setOnLoadCallback(drawIt); </script> </head> <body style="font-family: Arial;border: 0 none;"> <table> <tr> <td> <div id="orgchart" style="width: 300px; height: 300px;"></ div> </td> <td> <div id="table" style="width: 300px; height: 300px;"></div> </td> <td><div id='map_canvas'></div></td> </tr> </table> </body> </html> On Mar 11, 10:20 am, VizBoy <[email protected]> wrote: > Hi, > > Please send me your entire html code so I can debug more easily. > Thanks > > - VizBoy. > > On Wed, Mar 11, 2009 at 1:32 AM, artonice <[email protected]> wrote: > > > I'm trying to get a linking&brushing effect using event interaction > > between a geomap, an orgchart and a table. I've been able to get the > > table and the orgchart to interact and the geomap with the orgchart > > and table (see snippet below). I now however want to set the selection > > of the geomap (region) by selecting the table and the orgchart but I > > do not seem the be able to get it working. I guess is has something to > > do with the fact that the geomap uses hover and not select, but I > > would assume this should be possible to achieve. Any suggestions? > > > google.visualization.events.addListener(geomap, 'select', > > function() { > > table.setSelection(geomap.getSelection()); > > orgchart.setSelection(geomap.getSelection()); > > }); --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Google Visualization API" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/google-visualization-api?hl=en -~----------~----~----~----~------~----~------~--~---
