javascript - 如何使用 Google Maps API v3 更新已创建的 map

Question

我能够使用以下代码创建 map 并同时向其添加标记:

         function initialize() {
           var mapOptions = {
                zoom: 4,
                center: new google.maps.LatLng(39.013421, -94.707803)
           };

           var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);';

          geocoder = new google.maps.Geocoder();
          var address = "12345 Random Address Dr San Diego, CA";
          geocoder.geocode( { 'address': address}, function(results, status) {
          var marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location,
                icon: "../image/icons/map/icon_marker1.png"
              });
          });

        }       
        function loadScript() {
          var script = document.createElement('script');
          script.type = 'text/javascript';
          script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp' +
              '&signed_in=true&callback=initialize';
          document.body.appendChild(script);
        }

        window.onload = loadScript;

如果我尝试删除标记代码并稍后调用它，我会收到错误“ map 未定义”，但此时它不是......是否有正确的方法来调用现有 map ？目标是单击一个按钮并触发类似以下代码的内容:

$(".addLayer").click(function(){
     //Add Marker Code
            geocoder = new google.maps.Geocoder();
            var address = "12345 Random Address Dr San Diego, CA";
            geocoder.geocode( { 'address': address}, function(results, status) {
              var marker = new google.maps.Marker({
                    map: map,
                    position: results[0].geometry.location,
                    icon: "../image/icons/map/icon_marker1.png"
                });
            });
});

Answer 1

在脚本开头定义 map 。 这里你的 map 变量的范围只是你的initialize()函数

编辑:这里是一个示例

var map = new google.maps.Map(document.getElementById('map-canvas'));';

function initialize() {
    var mapOptions = {
        zoom: 4,
        center: new google.maps.LatLng(39.013421, -94.707803)
    };

    map.setOptions(mapOptions)

    geocoder = new google.maps.Geocoder();

    /* the rest of your code */

}

$(".addLayer").click(function(){
 //Add Marker Code
        geocoder = new google.maps.Geocoder();
        var address = "12345 Random Address Dr San Diego, CA";
        geocoder.geocode( { 'address': address}, function(results, status) {
          var marker = new google.maps.Marker({
                map: map,
                position: results[0].geometry.location,
                icon: "../image/icons/map/icon_marker1.png"
            });
        });
});