谷歌地圖不集中於標記

以下代碼是在頁面上找到memberId並呈現地圖併成功放置標記，但它並未將標記上的地圖居中。地圖最終集中在可能是默認地點（索馬里）的地方。谷歌地圖不集中於標記

我在做什麼錯？

function initialize() { 
    var memberId = $('#member-section').data("member-id"); 
    if (typeof memberId === "undefined") { 
     memberId = 0; 
    } 

    var latitude = $('#member-section').data("latitude"); 
    if (typeof latitude === "undefined") { 
     latitude = 51.21921589999999; 
    } 
    var longitude = $('#member-section').data("longitude"); 
    if (typeof longitude === "undefined") { 
     longitude = 4.402881799999932; 
    } 

    var mapCentreLatlng; 
    mapCentreLatlng = new google.maps.LatLng(latitude, longitude); 

    buildMap(memberId, mapCentreLatlng); 
} 

function buildMap(memberId, mapCentreLatlng) { 
    google.maps.visualRefresh = true; 

    var infowindow = null; 

    var mapOptions = { 
     zoom: 5, 
     center: mapCentreLatlng, 
     mapTypeControlOptions: { 
      mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'map_style'] 
     } 
    }; 

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

    // Create a custom marker 
    var markerImage = '/img/map-flag-alt.png'; 

    // Get json data and loop to create markers for map 
    $.getJSON("/Umbraco/Api/searchmembers/GetMembers?memberId=" + memberId, function (data) { 
     $.each(data, function (members, member) { 
      // Add marker 
      var marker; 
      var memLatLng = new google.maps.LatLng(member.Latitude, member.Longitude); 
      marker = new google.maps.Marker({ 
        position: memLatLng, 
        map: map, 
        title: member.MemberName, 
        icon: markerImage 
       }); 

      // Add click event for marker 
      google.maps.event.addListener(marker, 'click', function() { 
       if (infowindow) { 
        infowindow.close(); 
       } 
       // Create info window and create content 
       var contentString = 
        '<h2 id="firstHeading">' + member.MemberName + '</h2>' + 
        '<div id="bodyContent">' + 
        '<p>' + member.Address + '</p>' + 
        '<p><a href="' + member.Url + '">View Company Profile</a></p>' + 
        '</div>'; 
       infowindow = new google.maps.InfoWindow({ 
         content: contentString 
        }); 

       infowindow.open(map, marker); 
      }); 
     }); 
    }); 
}

來源

2017-04-14 wingyip

創建標記後，您可以添加'map.setCenter（memLatLng）'調用。 – Titus

爲什麼mapOptions中的設置被忽略？ – wingyip

也許你function initialize()稱爲文檔加載完成之前，所以你的var定義沒有找到#member-section。嘗試在DOM滿載時使用函數$(document).ready(function initialize(){...});或者添加map.setCenter(memLatLng)以根據Titus評論重新居中地圖。

來源

2017-04-16 08:28:31 Gfour

谷歌地圖不集中於標記

回答

相關問題