Pan Zoom Testing

by cmoreira

HTML

<script src="http://www.google.com/jsapi?fake=.js"></script>
<div id="visualization"></div>

CSS

#visualization div {
    width:400px;
    height:300px;
    overflow:hidden;
    
}
#visualization div div svg {
    margin-top:0px;
}

JavaScript

google.load('visualization', '1', {'packages': ['geochart']});
google.setOnLoadCallback(drawVisualization);

  function drawVisualization() {var data = new google.visualization.DataTable();

 data.addColumn('number', 'Lat');                                
 data.addColumn('number', 'Long');
 data.addColumn('string','tooltip'); 
 data.addColumn('number','Example');
 data.addColumn({type:'string', role:'tooltip'});
                                
data.addRows([[41.151636,-8.569336,'Portugal',0,'test PT']]);
data.addRows([[ 39.059575,-98.789062,'USA',1,'test US']]);
                               
 
 var options = {
 colorAxis:  {minValue: 0, maxValue: 1,  colors: ['#6699CC','#9966CC']},
 legend: 'none', 
 displayMode: 'markers', 
 enableRegionInteractivity: 'true', 
 resolution: 'countries',
 sizeAxis: {minValue: 1, maxValue:1,minSize:5,  maxSize: 5},
 region:'world',
  width:400,
 height:300   
 };
                                
  var chart = new google.visualization.GeoChart(document.getElementById('visualization')); 
  
//CODE TO APPEND SCRIPT
                                
google.visualization.events.addListener(chart, 'ready', function () {
   
var script = document.createElementNS('http://www.w3.org/2000/svg', 'script');     
script.setAttributeNS('http://www.w3.org/1999/xlink', 'xlink:href', 'http://www.cyberz.org/projects/SVGPan/SVGPan.js');        
var svg = document.getElementsByTagName('svg')[0];
svg.appendChild(script);
});                                

         
 chart.draw(data, options);
 
 
 }