自定义标记没有在谷歌api上显示

时间:2013-09-18 12:07:52

标签: javascript google-maps google-maps-api-3

XML输出在这里 该网站在这里

这是我的代码

我想将自定义图像与自定义图像放在标记上,xml正确显示我想但是标记没有在地图上显示...请正确或只是更正非常感谢

var customIcon = {
    1 : {
        icon : './img/ps.png'
    },
    }


var myLatlng, map, marker, html;

function initialize() {
  myLatlng =new google.maps.LatLng(15.976345,120.56681);
  var mapOptions = {
    zoom: 9,
    center: myLatlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }


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


}


function loadStations() { // Function to load Stations


    downloadUrl("pau_genxml.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 head = markers[i].getAttribute("chead");
        var hotline = markers[i].getAttribute("hotline");
        var point = new google.maps.LatLng(
            parseFloat(markers[i].getAttribute("lat")),
            parseFloat(markers[i].getAttribute("lng")));
        html = "<b>" + name + "</b> <br/><b>Head: </b>" + head
        + "</br><b>Hotline/Contact No: </b>" + hotline;;
        var id = 1; //Initialize to match ICON id   
        var icon = customIcon[id] || {};
        var marker = new google.maps.Marker({
          map: map,
          position: point,
          icon: icon.icon           
        });
        //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() {}


google.maps.event.addDomListener(window, 'load', initialize);

1 个答案:

答案 0 :(得分:0)

您已将map存储为load()中的本地变量,因此loadStations()中的任何内容都无法看到它。移动它,以及它依赖的其他变量 - myLatLngmapOptions - 在函数之外:

var customIcon = {
  1 : { icon : './img/ps.png' },
};

var myLatLng = new google.maps.LatLng(16.006216,120.351105);

var mapOptions = {
  zoom: 9,
  center: myLatLng,
  mapTypeId: google.maps.MapTypeId.ROADMAP
};

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

function load() {
  // rest of your function
}