多個標記，單個信息窗口，錨定在地圖底部

我無法渲染錨定有多個標記的Google地圖infowindow。多個標記，單個信息窗口，錨定在地圖底部

我使用MVC 3和JavaScript來渲染地圖，地圖呈現良好，以及相關的信息窗口。但我希望信息窗口顯示在地圖的底部，而不是相對於標記。根據用於搜索的國家，每張地圖的起點可能會有所不同。我的JavaScript以下（這是工作）>我只是不知道如何改變信息窗口：

function initializeMap() { 

var countryID = $("#CountryID :selected").val(); 
var cityID = $("#cities :selected").val(); 
var regionID = $("#regions :selected").val(); 
var locationtypeID = $("#LocationTypeID :selected").val(); 
var filtertype = $("#filtertype").val(); 
var latlng; 

$.ajax({ 
    type: "GET", 
    url: "/ajaxcalls/getCentre", 
    data: "cid=" + countryID, 
    datatype: "json", 
    success: function (result) { 
     var gpscoords = (result).split(","); 
     latlng = new google.maps.LatLng(gpscoords[0], gpscoords[1]); 
    }, 
    error: function (req, status, error) {    
    } 
}); 

var myOptions = { 
    zoom: 7, 
    center: latlng, 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
};  

var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

$.ajax({ 
    type: "GET", 
    url: "/ajaxcalls/getmarkers", 
    data: "cid=" + countryID + "&rid=" + regionID + "&xid=" + cityID + "&tid=" + locationtypeID + "&filterType=" + filtertype, 
    datatype: "json", 
    success: function (result) { 

     var infowindow = null; 

     infowindow = new google.maps.InfoWindow({ 
      content: "holding..." 
     }); 

     $.each(result, function (i, item) { 

      var gpscoords = (item.GPSCoOrds.toString()).split(","); 

      var mpos = new google.maps.LatLng(gpscoords[1], gpscoords[0]); 

      var markerobject = ""; 

      if (item.LocationTypeID == 2) { 
       markerobject = "atm.png"; 
      } 
      else { 
       markerobject = "bank.png"; 
      } 

      marker = new google.maps.Marker({ 
       map: map, 
       position: mpos, 
       draggable: false, 
       icon: "/content/mapicons/" + markerobject, 
       title: item.Designation.toString() + " " + item.Address.toString() 
      }); 

      google.maps.event.addListener(marker, 'mouseover', function() { 
       var windowcontent = "<div>Site Name: "; 
       windowcontent = windowcontent + item.Designation + "</div>"; 
       windowcontent = windowcontent + "<div>Address: " + item.Address + "</div>"; 
       windowcontent = windowcontent + "<div>Contact Number: " + item.contactNumber + "</div>"; 
       windowcontent = windowcontent + "<div>Branch Type: " + item.BranchType + "</div>"; 
       windowcontent = windowcontent + "<div>Network Provider: " + item.NetworkProvider + "</div>"; 
       windowcontent = windowcontent + "<div>Network Capacity: " + item.NetworkCapacity + "</div>"; 

       infowindow.setContent(windowcontent); 

       infowindow.open(map, this); 
      }); 
     }); 
    }, 
    error: function (req, stats, error) { 
     alert(error); 
    } 
}); 
    } 

    $(document).ready(function() { 
     $("#mapupdater").click(function() { 
    initializeMap(); 
}); 
    });

任何幫助，將不勝感激。

來源

2011-11-22 Robin Curtis

不要錨定信息窗口的標記與infowindow.open(map, this);

只是做infowindow.open(map);

但是你仍然要告訴信息窗口在哪裏出現。在創建時使用position屬性，或者在創建後使用setPosition()。

來源

2011-11-22 14:00:24 duncan

Postition屬性的問題在於它仍然是一個LatLng對象。如果您滾動地圖或移動地圖，infowindow就會移開，因爲此時地圖上可能不會顯示latlng。我的理解是否正確？ –

是的，所以您需要在地圖邊界發生變化時擁有事件偵聽器，以重繪任何打開的infowindows。 – duncan

感謝所有的回覆，我剛剛創建了一個靜態浮動div，並使用ajax調用來直接更新數據庫中的信息。 –

多個標記，單個信息窗口，錨定在地圖底部

回答

相關問題