谷歌地图显示无jQuery

时间:2013-10-27 15:51:43

标签: javascript jquery google-maps

我有两个js文件。首先定义一个谷歌地图,如:lat,lon,mapOptions,marker等。这是:

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-canvas容器的操作。 map-canvas的默认状态是display:none。单击特定元素后显示。现在,我已经读到显示隐藏地图的常见问题,我应该放下这行代码:

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

当我点击生成带有地图的容器的元素时。但是当我把这个代码放入firebug告诉我:“ReferenceError:map not defined”。它是对的,因为它在不同的文件中。我无法合并这两个文件。我该如何管理?

1 个答案:

答案 0 :(得分:1)

将地图变量放在全局范围内:

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);