Auto switch to other mapType on max zoom level in google maps -
by default map has terrain maptype maxzoom=15. want map change it's maptype hybrid (that has maxzoom=22) automatically when user tries zoom map above 15 level.
currently following:
google.maps.event.addlistener(map,"zoom_changed",function() { if (map.getzoom() == 15) map.setmaptypeid("hybrid"); }); this solution not suit me because here loose terrain map zoom=15, , want change maptype if there's no data maptype on current level. further zooming in 16 level disabled on terrain map.
is there way (rewrite maxzoom setting 16 terrain maptype or use custom maptype)?
rather simple solution create own maptypes based on terrain , hybrid built-in types. take existent map.maptypes.get("terrain") maptype object , increase it's maxzoom setting, after replace terrain maptype our edited object.
this basic example shows how create , append custom maptype google maps: https://developers.google.com/maps/documentation/javascript/examples/maptype-base.
let's consider 2 basic maptypes: hybrid , terrain , build our own maptypes on them:
var terrainmaptype = map.maptypes.get("terrain"); var hybridmaptype = map.maptypes.get("hybrid"); var terrainzoomadd = terrainmaptype.maxzoom<hybridmaptype.maxzoom?1:0; var hybridzoomadd = terrainmaptype.maxzoom<hybridmaptype.maxzoom?0:1; map.maptypes.set("terrain+",$.extend({},terrainmaptype,{ maxzoom: terrainmaptype.maxzoom + terrainzoomadd, maxzoomincreased: terrainzoomadd>0 })); map.maptypes.set("hybrid+",$.extend({},hybridmaptype,{ maxzoom: hybridmaptype.maxzoom + hybridzoomadd, maxzoomincreased: hybridzoomadd>0 })); now have custom map types, 1 of them might have increased maxzoom value, , map on maxzoom level black, because there's no actual data it.
let's subscribe zoom_change event , switch 1 maptype when map black:
var onzoomchange = function() { var maptypeterrain = map.maptypes.get("terrain+"); var maptypehybrid = map.maptypes.get("hybrid+"); var maxzoomterrain = maptypeterrain ? maptypeterrain.maxzoom : 0; var maxzoomhybrid = maptypehybrid ? maptypehybrid.maxzoom : 0; if (map.getmaptypeid() == "terrain+" && map.getzoom() == maxzoomterrain && maxzoomterrain<maxzoomhybrid) map.setmaptypeid("hybrid+"); if (map.getmaptypeid() == "hybrid+" && map.getzoom() == maxzoomhybrid && maxzoomhybrid<maxzoomterrain) map.setmaptypeid("terrain+"); } the last thing change built-in maptypeid_change method little bit. when user switches maptype manually , current zoom level greater maxzoom of maptype set, google maps sets zoom maxzoom , map becomes black because there's no actual data.
var onmaptypeidchange = function() { var maptype = map.maptypes.get(map.getmaptypeid()); if (!maptype) return; if (maptype.maxzoomincreased && map.getzoom() >= maptype.maxzoom) map.setzoom(maptype.maxzoom-1); } here's full code: http://jsfiddle.net/kasheftin/xj2kq/.
Comments
Post a Comment