簡體   English   中英

Google地圖標記未以引導模式顯示

[英]Google map marker not showing in bootstrap modal

google map標記未以自舉模式顯示。

這是我的jQuery代碼:

function map_init() {
  if(!$('body').data('map')){
      var var_mapoptions = {
          zoom: 6,
          mapTypeControl: true,
          mapTypeControlOptions: {
            style: google.maps.MapTypeControlStyle.DROPDOWN_MENU,
            mapTypeIds: ['roadmap', 'terrain']
          }
        };
    $('body').data('map',new google.maps.Map($('<div id="map"/>')[0],
            var_mapoptions));

    }
    return  $('body').data('map');
  }
  var Lat;
  var lon;
  $(document).on('click','a[data-map]',function(){
    var data=$(this).data('map'),
        map=map_init();

        var geocoder = new google.maps.Geocoder();
        var address = data;

        geocoder.geocode( { 'address': address}, function(results, status) {

          if (status == google.maps.GeocoderStatus.OK) {
            var latitude = results[0].geometry.location.lat();
            var longitude = results[0].geometry.location.lng();
          } 
           Lat = latitude;
           lon = longitude;
         }); 
    $('#map_modal')
      .find('.modal-body')
        .append(map.getDiv())
      .end()
      .find('.modal-title')
        .text(data.Name)
      .end()
      .one('shown.bs.modal',function(){
            google.maps.event.trigger(map, "resize");
                map.setCenter({lat:Lat,lng:lon});
                });
            })
      .modal('show');
  });

在此處輸入圖片說明

它顯示modal,但不顯示map標記。 經度和緯度值來自php代碼(即while循環值)。

我相信您沒有創建任何Google Maps Javascript API標記對象。

標記可識別地圖上的位置。 默認情況下,標記使用標准圖像。 標記可以顯示自定義圖像,在這種情況下,它們通常稱為“圖標”。

我建議編輯並在此行中添加以下代碼:

if ( status == google.maps.GeocoderStatus.OK ) {
  //add marker code here
}

要添加的代碼:

var marker =  new google.maps.Marker({
   positions : new google.maps.LatLng(results[0].geometry.location.lat(), results[0].geometry.location.lng() ),
   map: map,
   title: 'I am a marker :)'
});

和您的標記將出現。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM