将标记添加到 google 地图，参考地图但不要重新实例化它

Question

尝试添加标记时，地图变为灰色屏幕。我已将其缩小到 var map = new google.maps.Map(document.getElementById('map'), mapOptions); 行。我得到了一张 ID 为 map 的地图，当用户从搜索栏中选择一个位置时，该位置必须以图钉/标记的形式添加到地图中。

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

知道如何解决这个问题并添加标记吗？

Answer 1

当您第一次创建地图时，将其存储在全局可访问的地方（例如，作为全局变量或 document.getElementById('map') 的属性）。

在 mezmerize 中使用存储的映射而不是创建新实例。

演示（通过$('#map').data()存储地图实例）：

http://jsfiddle.net/doktormolle/Lomf6v77/

将标记添加到 google 地图，参考地图但不要重新实例化它

Add marker to google map, reference map but don't reinstantiate it

javascript

google-maps

google-maps-api-3