谷歌地图标记消失

时间:2013-01-05 09:46:10

标签: javascript jquery html google-maps-api-3 google-maps-markers

我的地图标记存在问题。第一次加载地图时,一切正常。然而,当div被隐藏并重新显示(并调用相同的函数map())时,地图加载正常但标记不会出现,即使地图居中于我真正的位置。

以下是地图编码的片段:

function map(){ 
  var latlng = new google.maps.LatLng(38.54, 15.35);
  infowindow = new google.maps.InfoWindow();

  var mapOptions = {
zoom: 5,
center: latlng,
panControl: false,
mapTypeControl: false,
scaleControl: false,
streetViewControl: false,
overviewMapControl: false
};

  map = new google.maps.Map(document.getElementById("map"), mapOptions);    
  switch (map_view_id) {
case "1" :  map.setMapTypeId(google.maps.MapTypeId.ROADMAP);
            break;
case "2" :  map.setMapTypeId(google.maps.MapTypeId.SATELLITE);
            break;
case "3" :  map.setMapTypeId(google.maps.MapTypeId.HYBRID);
            break;
  } 

  google.maps.event.addListenerOnce(map, 'tilesloaded', function(){     
    updateMap();           
   }); 
  }


function updateMap() {
  map.setCenter(new google.maps.LatLng(latitude, longitude));
  map.setZoom(13);

  marker = new google.maps.MarkerImage("/android_asset/www//graphics/car.png",
new google.maps.Size(96.0, 96.0),
new google.maps.Point(0, 0),
new google.maps.Point(48.0, 48.0)
 );

  markerShadow = new google.maps.MarkerImage("/android_asset/www/graphics/car_shadow.png",
new google.maps.Size(145.0, 96.0),
new google.maps.Point(0, 0),
new google.maps.Point(48.0, 48.0)
 ); 

  point = new google.maps.LatLng(latitude,longitude);

  if(!markerUserPosition){
// Create marker
markerUserPosition = new google.maps.Marker({
  position: point,
  map: map,
  icon: marker,
  shadow: markerShadow,
  draggable:false,
      animation: google.maps.Animation.DROP
    });
  } else {
     // Move marker
      markerUserPosition.setPosition(point);        
  }

}

更新 有没有办法完全销毁谷歌地图?因为在隐藏中我可以在技术上完全破坏地图并在需要时加载它。

2 个答案:

答案 0 :(得分:1)

$("#target-map-block").show();后,您可以通过

重建地图

map = new google.maps.Map(document.getElementById("map"), mapOptions);

答案 1 :(得分:-1)

试试这个,

$("#button-id-to-show").click(function() {
  $("#target-map-block").show();
  updateMap();
});