通過jQuery的谷歌地圖API V3加載XML

更新： 疲勞發生的用戶錯誤，而不是代碼本身，原來是問題。我只是錯誤地稱了initialize()函數兩次。我將離開這篇文章，因爲代碼片段可能對希望通過jQuery使用Google Map的XML數據的其他人有用。通過jQuery的谷歌地圖API V3加載XML

我通過jQuery for Google Maps（API V3）從XML文件加載地圖標記座標和infoWindow內容。一切似乎都工作正常 ~~，除了每個標記添加兩次~~ 。

這裏是我的JS：

google.load("maps", "3", {other_params:"sensor=false"}); 
google.load("jquery", "1.6.2"); 

var infowindow; 
var map; 

function initialize() { 

// Specify center of the map 
var latLng = new google.maps.LatLng(51.781,-107.402); 

// Customize map appearance 
var mapOptions = { 
    center: latLng, 
    mapTypeControl: false, 
    mapTypeId: 'roadmap', 
    navigationControl: true, 
    navigationControlOptions: {style: google.maps.NavigationControlStyle.SMALL, position: google.maps.ControlPosition.TOP_RIGHT}, 
    scaleControl: false, 
    streetViewControl: false, 
    zoom: 3 
} // end mapOptions(); 

// Load the Google map into the #mapCanvas div 
map = new google.maps.Map(document.getElementById("mapCanvas"), mapOptions); 

jQuery.get("iphorm/test.xml", function(data) { 
    jQuery(data).find("marker").each(function() { 
    var eachMarker = jQuery(this); 
    var markerCoords = new google.maps.LatLng(
     parseFloat(eachMarker.find("Latitude").text()), 
     parseFloat(eachMarker.find("Longitude").text()) 
    ); 
    var name = eachMarker.find("Name").text(); 
    var content = eachMarker.find("Content").text(); 
    var html = "<div class='info-blob'>" + name + "<br />" + content + "</div>"; 

    var marker = addMarker(html, markerCoords); 

    }); 
    }); 
} // end initialize(); 

// Create a marker for each XML entry 
function addMarker(html, markerCoords) { 

// Place the new marker 
var marker = new google.maps.Marker({ 
    animation: google.maps.Animation.DROP, 
    map: map, 
    position: markerCoords 
}); // end place the new marker 

// Add event listener. On marker click, close all open infoWindows open current infoWindow. 
google.maps.event.addListener(marker, "click", function() { 
    if (infowindow) infowindow.close(); 
    infowindow = new google.maps.InfoWindow({content: html}); 
    infowindow.open(map, marker); 
}); // end add event listener 

// Display marker 
return marker; 

} // end addMarker(); 

// On page lod, initialize the map 
google.setOnLoadCallback(initialize);

我的XML文件是這樣的：

<?xml version="1.0" encoding="utf-8"?> 
    <markers> 
     <marker> 
      <Name>Jane Smith</Name> 
      <Content>A bit of content goes here.</Content> 
      <Latitude>53.69629</Latitude> 
      <Longitude>-123.925437</Longitude> 
     </marker> 
     <marker> 
      <Name>Joe Smith</Name> 
      <Content>A bit of content goes here.</Content> 
      <Latitude>55.627598</Latitude> 
      <Longitude>-115.136375</Longitude> 
     </marker> 
</markers>

顯然，從XML中的每個元素<marker>只能一次地圖抓起。 ~~關於如何解決此錯誤的任何想法？~~ 編輯：代碼按預期工作。

來源

2012-01-07 Jared

這是一個問題或答案 – defau1t 2012-01-07 20:00:14

@refhat這是一個問題，但現在是一個答案。我的代表還不夠高，無法回答我自己的問題。只要我可以（一天結束），我會。 – Jared 2012-01-07 21:19:22

JS和XML都運行正常。我只是錯誤地稱了initialize()函數兩次。

來源

2012-01-09 01:08:54 Jared

通過jQuery的谷歌地圖API V3加載XML

回答

相關問題