Kousik
Kousik

Reputation: 22415

How to set zoomLevel in google Visualization Map api?

I am trying to implement visualization map api,following this link https://developers.google.com/chart/interactive/docs/gallery/map

i am successfully drawing the point on the google map but not able to set the zoomlevel. For single point the zoomlevel automatic set to 19(max level).

my code:-

var map = new google.visualization.Map(document.getElementById('map_div'));

map.draw(data, {showTip: true, zoom:14,  mapType: 'normal', useMapTypeControl:true, enableScrollWheel:false});

I have tried this map.setZoom(12) but its not working.

Upvotes: 1

Views: 1306

Answers (2)

Dr.Molle
Dr.Molle

Reputation: 117324

The name of the property that defines the zoom-level in google.visualization.Map is not zoom,

it's called zoomLevel (funny, the title of your question contains the correct answer^^)


However, it's curious that the visualization-API does not provide a method to access the underlying google.maps.Map-instance.

You may add such a method (on your own risk), add this to the onload-callback:

google.visualization.Map.prototype.getMap=function(){
  for(var k in this){
   if(this[k].constructor==google.maps.Map)return this[k];
  }
}

you now may access the google.maps.Map-instance by calling the method getMap of the google.visualization.Map-instance.

Example:

map.getMap().setZoom(12);

Upvotes: 5

woofmeow
woofmeow

Reputation: 2408

That is because the map object has no setZoom method according to the documentation page that you have given.

You can probably try redrawing the map using using draw method like this

var newZoom = 12;
map.draw(data, {showTip: true, zoom:newZoom,  mapType: 'normal', useMapTypeControl:true, enableScrollWheel:false});

Upvotes: 0

Related Questions