尝试添加标记时,地图会变为灰色屏幕。我已将其缩小到var map = new google.maps.Map(document.getElementById('map'), mapOptions);
行。我得到了一个id为map
的地图,当用户从搜索栏中选择一个位置时,该位置必须以pin / marker的形式添加到地图中。
function mezmerize(address, lat, lon) {
$('#myPlaceTextBox').val("");
var latlong = getLatLong(address);
var location_html = '<li class="location" data-location="'+address+'">'+
'<span class="title">'+address+' </span>'+
'<span class="" onclick="deleteMe()"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></span>'+
'<input type="hidden" name="chosen_location[]" value="'+address+'">'+
'<input type="hidden" name="latitude[]" value="'+lat+'">'+
'<input type="hidden" name="longitude[]" value="'+lon+'">'+
'<input type="hidden" name="address[]" value="'+address+'">'+
'</li>';
$(".interests_wrapper").append(location_html);
console.log(address);
console.log(lat + "," + lon);
var myLatlng = new google.maps.LatLng(lat + "," + lon);
var mapOptions = {
zoom: 10,
center: myLatlng
}
var map = new google.maps.Map(document.getElementById('map'), mapOptions);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title: address
});
var optOptions = {
urlBase: '/codeigniter/ads2trade/',
showRadii: true,
currentFilterCriteria: {},
showSearchPOIButton: true,
showFilterButton: true,
showLegend: false
};
var clusterOptions = {};
var spiderOptions = {};
var html2canvasOptions = {
logging: false
};
var adsMap = new AdsMap(map, clusterOptions, spiderOptions, html2canvasOptions, optOptions);
adsMap.addMarker(marker);
}
//
function getLatLong(address){
var lattitude = "0";
var longitude = "0";
$.ajax({
url:"https://maps.googleapis.com/maps/api/geocode/json?address="+address+"&sensor=false",
type: "POST",
success:function(res){
lattitude = res.results[0].geometry.location.lat;
longitude = res.results[0].geometry.location.lng;
//console.log(lattitude);
//console.log(longitude);
return lattitude + ',' + longitude;
},
error: function(res) {
console.log(res);
}
});
}
如何修复此问题并添加标记?
答案 0 :(得分:1)
创建地图时,第一次将地图存储在可全局访问的地方(例如,作为全局变量或document.getElementById('map')
的属性)。
在mezmerize
内使用存储的地图而不是创建新实例。
Demo(通过$('#map').data()
存储Map-instance):