2013-04-02 56 views
0

我有一個MySQL表格,每一行都有經度和緯度座標。 繼these instructions我創建了一個PHP文件生成此XML代碼:我無法看到由PHP/MySQL創建谷歌地圖的標記圖標

<markers> 
<marker name="Altopascio" anno="b. dal 1991 al 2000" gruppi="Sinti" affollamento="da 26 a 50" lat="10.6744775772094" lng="43.8144836425781" criticita="bassa" lat2="4852647" lng2="1634697"/> 
<marker name="Buggiano" anno="a. fino al 1990" gruppi="Rom istriani" affollamento="da 51 a 100" lat="10.7345352172851" lng="43.8763999938964" criticita="nessuna" lat2="4859624" lng2="1639383"/> 
<marker name="Carrara - Insediamento di Lavello" anno="a. fino al 1990" gruppi="Rom Ex Iugoslavia" affollamento="da 26 a 50" lat="10.1" lng="44.0793380737304" criticita="media" lat2="4881291" lng2="1588201"/> 
[...] 
</markers> 

之後,依然遵循谷歌開發的說明,我創建了這個代碼地圖:

<script type="text/javascript"> 
//<![CDATA[ 

var customIcons = { 
    nessuna: { 
    icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png', 
    shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png' 
    }, 
    bassa: { 
    icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png', 
    shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png' 
    }, 
    media: { 
    icon: 'http://labs.google.com/ridefinder/images/mm_20_green.png', 
    shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png' 
    }, 
    alta: { 
    icon: 'http://labs.google.com/ridefinder/images/mm_20_yellow.png', 
    shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png' 
    } 
}; 

function load() { 
    var map = new google.maps.Map(document.getElementById("map"), { 
    center: new google.maps.LatLng(43.7639427185058, 11.3140087127685), 
    zoom: 13, 
    mapTypeId: 'roadmap' 
    }); 
    var infoWindow = new google.maps.InfoWindow; 

    // Change this depending on the name of your PHP file 
    downloadUrl("gisajax_genxml.php", function(data) { 
    var xml = data.responseXML; 
    var markers = xml.documentElement.getElementsByTagName("marker"); 
    //alert(markers.length); 
    for (var i = 0; i < markers.length; i++) { 
     var name = markers[i].getAttribute("name"); 
     //alert(i); 
     var point = new google.maps.LatLng(
      parseFloat(markers[i].getAttribute("lat")), 
      parseFloat(markers[i].getAttribute("lng"))); 
     var html = "<b>" + name + "</b> <br/>"; 
     var icon = customIcons[criticita] || {}; 
     var marker = new google.maps.Marker({ 
     map: map, 
     position: point, 
     icon: icon.icon, 
     shadow: icon.shadow 
     }); 
     bindInfoWindow(marker, map, infoWindow, html); 
    } 
    }); 
} 

function bindInfoWindow(marker, map, infoWindow, html) { 
    google.maps.event.addListener(marker, 'click', function() { 
    infoWindow.setContent(html); 
    infoWindow.open(map, marker); 
    }); 
} 

function downloadUrl(url, callback) { 
    var request = window.ActiveXObject ? 
     new ActiveXObject('Microsoft.XMLHTTP') : 
     new XMLHttpRequest; 

    request.onreadystatechange = function() { 
    if (request.readyState == 4) { 
     request.onreadystatechange = doNothing; 
     callback(request, request.status); 
    } 
    }; 

    request.open('GET', url, true); 
    request.send(null); 
} 

function doNothing() {} 
</script> 

我不能瞭解爲什麼我在地圖上看不到標記圖標。 謝謝你的幫助。

+0

哪裏load()函數叫什麼名字? – Kaloyan

+1

當您執行「檢查XML輸出工作」中的步驟時發生了什麼?如果您更改標記定義以刪除自定義圖標(註釋掉圖標和陰影屬性),會發生什麼情況? – geocodezip

+0

@Kaloyan:身體標記。 –

回答

1

您可以設置圖標customIcons[criticita]但我認爲這應該是customIcons[markers[i].getAttribute("criticita")]

而且你new google.maps.InfoWindow;但應該是new google.maps.InfoWindow();

+0

我試過了,但標記仍然不可見 –

+0

你是否收到任何JS錯誤?如果你取消註釋alert(markers.length),你會得到什麼? 'alert(i);'? – duncan

+0

markers.length給了我在mysql db(53)中的行數奇怪的事情(我想)在警報(i);這個給我只有第一個警報(一個警報窗口內部爲「0」),但要準確地工作,它應該創建54個不同的窗口出租警報窗口,對吧?附:沒有js錯誤 –