谷歌地图显示没有jQuery

Google map display none jQuery

本文关键字:jQuery 显示 谷歌地图      更新时间:2023-09-26

我有两个js文件。第一个定义一个谷歌地图,如:纬度,伦敦,地图选项,标记等。在这里:

function initialize() {
var myLatlng = new google.maps.LatLng(settings.custom_contact.lat, settings.custom_contact.lng);
var mapOptions = {
  zoom: 13,
  center: myLatlng,
  mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var contentString = '';
var marker = new google.maps.Marker({
  position: myLatlng,
  map: map,
  title: ''
}); 
}
google.maps.event.addDomListener(window, 'load', initialize);

第二个包含显示画布容器 #map 的一些操作。地图画布的默认状态为显示:无。单击特定元素后,它会显示。现在,我已经读到显示隐藏地图的常见问题,我应该放这行代码:

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

当我单击使带有地图的容器可见的元素时。但是当我输入这段代码时,Firebug 告诉我:"参考错误:地图未定义"。这是正确的,因为它在不同的文件中。我无法合并这两个文件。我该如何管理?

将 map 变量放在全局范围内:

var map = null;
function initialize() {
var myLatlng = new google.maps.LatLng(settings.custom_contact.lat, settings.custom_contact.lng);
var mapOptions = {
  zoom: 13,
  center: myLatlng,
  mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var contentString = '';
var marker = new google.maps.Marker({
  position: myLatlng,
  map: map,
  title: ''
}); 
}
google.maps.event.addDomListener(window, 'load', initialize);