Question

谷歌地图地理编码功能在我的模态

中无法正常工作

我尝试了下面的问题

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

但它返回了我未定义的地图错误

我也试过这个 JS FIDDLE

比我尝试

google.maps.event.addListener(marker, 'click', function() {
        //My Google Map Code
});

但仍然不起作用我的代码如下

<script>

    var map;

     function initMap() {
        var map = new google.maps.Map(document.getElementById('map'), {
          zoom: 5,
          center: {lat: -34.397, lng: 150.644}
        });
        var geocoder = new google.maps.Geocoder();
        geocodeAddress(geocoder, maps);
      }

      function geocodeAddress(geocoder, resultsMap) {
        var address = "Ahmedabad India";
        geocoder.geocode({'address': address}, function(results, status) {
          if (status === 'OK') {
            resultsMap.setCenter(results[0].geometry.location);

             var contentString = '<div id="content">'+
            '<div id="siteNotice">'+
            '</div>'+
            '<h1 id="firstHeading" class="firstHeading">Websters House</h1>'+
            '<div id="bodyContent">'+
            'sacred to the Pitjantjatjara and Yankunytjatjara, the '+
            'Aboriginal people of the area. It has many springs, waterholes, '+
            'rock caves and ancient paintings. Uluru is listed as a World '+
            'Heritage Site.</p>'+
            '<p>Attribution: Uluru, <a href="https://en.wikipedia.org/w/index.php?title=Uluru&oldid=297882194">'+
            'https://en.wikipedia.org/w/index.php?title=Uluru</a> '+
            '(last visited June 22, 2009).</p>'+
            '</div>'+
            '</div>';

            var infowindow = new google.maps.InfoWindow({
              content: contentString
            });
            var marker = new google.maps.Marker({
              title: 'Uluru (Ayers Rock)',
              map: resultsMap,
              position: results[0].geometry.location
            });
            //Call Listner On Click Markre
            marker.addListener('click', function() {
              infowindow.open(map, marker);
            });

          } else {
            alert('Geocode was not successful for the following reason: ' + status);
          }
        });
      }

</script>

我使用关注Google APi来运行

<script async defer src="https://maps.googleapis.com/maps/api/js?key=XXXXXXMYKEYXXXX&callback=initMap"></script>

Answer 1

在这一行上，更改＆＃34;地图＆＃34;到＆＃34;地图＆＃34; （变量＆＃34;地图＆＃34;不存在）：

<connectionStrings>
<add name="MovieDBContext"
 connectionString="Data Source=(LocalDB)\v11.0; AttachDbFilename=|DataDirectory|\Movies.mdf; Integrated Security=True"
providerName="System.Data.SqlClient" />

当我这样做时，Geocode正在为我工作。

Answer 2

从我的API中删除&callback=initMap 并添加此代码

$("#myModal").on("shown.bs.modal", function () {
   initMap();
   google.maps.event.trigger(map, "resize");
});

它的工作顺利： - ）

谷歌地图地理编码不适用于模态

2 个答案: