Google地图 - 地图重新加载 [英] Google Maps - Map reload

问题描述

我有以下代码设置可以为各种区域应用地图

  var locations = [
 ['Liver Office  -  Liverpool Office'，53.40529，-2.988801，1]，
 ['Lond office  -  London Office'，51.515026，-0.086811，2]，
 
]; 
函数plotMap（loc）{
 
 var mapOptions = {
 zoom：17，
 center：new google.maps.LatLng（（locations [loc] [1 ]），（位置[loc] [2]）），
 stylers：[
 {saturation：-100} //<  -  This 
] 
}; 
 
 var map = new google.maps.Map（document.getElementById（'map'），
 
 mapOptions）; 
 
 var marker = new google.maps.Marker（{
 position：map.getCenter（），
 map：map，$ b $ mapTypeControlOptions：{
 mapTypeIds：[google.maps.MapTypeId.ROADMAP，'tehgrayz'] 
}，
 icon：'marketICO.png'，
 title：（locations [loc] [0]）
}）; 
 
 var infowindow = new google.maps.InfoWindow（）; 
 google.maps.event.addListener（marker，'click'，（function（marker））{
 return function（）{
 infowindow.setContent（locations [loc] [0]）; 
 infowindow.open（map，marker）; 
} 
}）（marker，loc））; 
 
 $ b $（'。livLink'）。click（function（）{
 plotMap（0）; 
}）; 
 $（'。lonLink'）。click（function（）{
 plotMap（1）; 
}）; 
 plotMap（0）; 
  

关于重新加载地图 - 目前上述脚本由2个标签按钮触发 - 如果地图被加载，第二个按钮被点击脚本重新运行并替换现有的地图 - 我只是想着内存问题 - 在加载第二个地图之前停止初始地图实例？

map1 和 map2 >例如）。

在文档就绪（或其他事件）上初始化两个贴图，并在更改标签页时触发贴图大小。

google.maps.event.trigger（map，'resize'）;

替换地图由相应的地图对象（对应于您显示的标签上的地图）。

I have the following code setup to apply a map for a variety of areas

var locations = [
  ['Liver Office - Liverpool Office', 53.40529, -2.988801, 1],
  ['Lond office - London Office', 51.515026, -0.086811, 2],

];
function plotMap(loc) {  

var mapOptions = {
    zoom: 17,
    center: new google.maps.LatLng((locations[loc][1]), (locations[loc][2])),
    stylers: [
    { saturation: -100 } // <-- THIS
  ]
};

var map = new google.maps.Map(document.getElementById('map'),

  mapOptions);

var marker = new google.maps.Marker({
    position: map.getCenter(),
    map: map,
     mapTypeControlOptions: {
     mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'tehgrayz']
    },
    icon: 'marketICO.png',
    title: (locations[loc][0])
});

var infowindow = new google.maps.InfoWindow();
    google.maps.event.addListener(marker, 'click', (function(marker) {
    return function() {
      infowindow.setContent(locations[loc][0]);
      infowindow.open(map, marker);
    }
  })(marker, loc));
}

$('.livLink').click(function(){
    plotMap(0);
});
$('.lonLink').click(function(){
    plotMap(1);
});
    plotMap(0);

Regarding reloading the map - at the moment the above script is triggered by 2 tab buttons - if a map is loaded and the second button is clicked the script re-runs and replaces the existing map - I'm just thinking of memory issues - should the initial map instance be stopped before loading a second?

解决方案

You can create 2 map instances (map1and map2 for example).

Initialize both maps on document ready (or another event) and trigger a map resize when changing tabs.

google.maps.event.trigger(map, 'resize');

Replace map by the appropriate map object (corresponding to the map on the tab you show).

这篇关于Google地图 - 地图重新加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！