2013-01-05 69 views
0

由於標題狀態我做錯了,我假設我必須做錯JS結構使其無法正常工作。到目前爲止,我點擊的按鈕標記不會出現在這裏是我正在使用的代碼。Onclick按鈕創建新標記

function addMyMarker() { //function that will add markers on button click 
     var mark = new google.maps.Marker({ 
      position:mapCenter, 
      map: map, 
       draggable:true, 
       animation: google.maps.Animation.DROP, 
      title:"This a new marker!", 
      icon: "http://maps.google.com/mapfiles/ms/micons/blue.png" 
     }); 
    } 

這裏是完全與上面添加的代碼。請幫忙。我對JS不太好。

var map; 
var markersArray = []; 
var mapCenter = new google.maps.LatLng(10.4167, 123.0000); 

    var customIcons = { 
    City: { 
    icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png', 
    shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png' 
    }, 
    Municipality: { 
    icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png', 
    shadow: 'http://labs.google.com/ridefinder/images/mm_20_shadow.png' 
    } 
}; 

    function load() { 
    map = new google.maps.Map(document.getElementById("map"), { 
    center: new google.maps.LatLng(10.4167, 123.0000), 
    zoom: 8, 
    mapTypeId: 'roadmap' 

    }); 
    var infoWindow = new google.maps.InfoWindow; 


    downloadUrl("xmlspitter.php", function(data) { 
    var xml = data.responseXML; 
    var markers = xml.documentElement.getElementsByTagName("marker"); 
    for (var i = 0; i < markers.length; i++) { 
     var name = markers[i].getAttribute("name"); 
     var address = markers[i].getAttribute("address"); 
     var type = markers[i].getAttribute("type"); 
     var point = new google.maps.LatLng(
      parseFloat(markers[i].getAttribute("lat")), 
      parseFloat(markers[i].getAttribute("lng"))); 
     var html = "<b>" + name + "</b> <br/>" + address; 
     var icon = customIcons[type] || {}; 
     var marker = new google.maps.Marker({ 
     map: map, 
     position: point, 
     icon: icon.icon, 
     shadow: icon.shadow 
     }); 
     markersArray.push(marker); 
     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 addMyMarker() { //function that will add markers on button click 
     var marker = new google.maps.Marker({ 
      position:mapCenter, 
      map: map, 
       draggable:true, 
       animation: google.maps.Animation.DROP, 
      title:"This a new marker!", 
      icon: "http://maps.google.com/mapfiles/ms/micons/blue.png" 
     }); 
    } 

    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() {} 
    } 

它使用。 * ** *編輯* ** * ***

<input type='button' id="drop" onClick="addMyMarker();"> 
+0

你的函數addMyMarker()似乎沒有在這段代碼中使用,它是c alled在別的地方? –

+0

它有一個輸入類型'

+1

你確定標記不存在嗎?我把你的代碼放到一個和你相似的項目中,標記出現在我定義的'mapCenter'上。在生成標記後,你的'mapCenter'可能不在顯示的Map的中心。縮小以查找。您可以使用LatLngBounds.extend和Map.fitBounds爲返回的結果設置最佳視口。見[Documentation](https://developers.google.com/maps/documentation/javascript/reference?hl=en#LatLngBounds) –

回答

0

嘗試使用全局變量,而不是創建一個新的...

function addMyMarker() { //function that will add markers on button click 
    marker = new google.maps.Marker({ 
+0

試過之前還是沒什麼,我把代碼移到了初始化加載函數之外 –