googlemapsapi:如何在标记下嵌入url链接并在单击时打开页面

jm81lzqq  于 2021-06-25  发布在  Mysql
关注(0)|答案(1)|浏览(399)

我创建了一个带有标记的谷歌Map。标记从mysql数据库获取信息。我有身份证,姓名,地址,纬度,液化天然气,类型和网址。在url中,我放置了一个指向餐厅的链接,并希望它在我单击标记时打开。但是,当我点击标记时,页面正在更改,但它将变成一个空白页面,上面写着“在该服务器上找不到请求的url/未定义”。如果有人能帮助我查看哪里出错,我将不胜感激。这是我的html代码:

<script>
  var customLabel = {
    restaurant: {
      label: 'R'
    },
    bar: {
      label: 'B'
    }
  };

    function initMap() {
    var map = new google.maps.Map(document.getElementById('map'), {
      center: new google.maps.LatLng(51.8980, -8.4737),
      zoom: 16
    });
    var infoWindow = new google.maps.InfoWindow;

      downloadUrl('locator.php', function(data) {
        var xml = data.responseXML;
        var markers = xml.documentElement.getElementsByTagName('marker');
        Array.prototype.forEach.call(markers, function(markerElem) {
          var id = markerElem.getAttribute('id');
          var name = markerElem.getAttribute('name');
          var address = markerElem.getAttribute('address');
          var type = markerElem.getAttribute('type');
          var url = markerElem.getAttribute('url');
          var point = new google.maps.LatLng(
              parseFloat(markerElem.getAttribute('lat')),
              parseFloat(markerElem.getAttribute('lng')));

          var infowincontent = document.createElement('div');
          var strong = document.createElement('strong');
          strong.textContent = name
          infowincontent.appendChild(strong);
          infowincontent.appendChild(document.createElement('br'));

          var text = document.createElement('text');
          text.textContent = address
          infowincontent.appendChild(text)

          var icon = customLabel[type] || {};
          var marker = new google.maps.Marker({
            map: map,
            position: point,
            label: icon.label

          });
          marker.addListener('click', function() {      
            infoWindow.setContent(infowincontent);
            infoWindow.open(map, marker);
            window.location.href = this.url;

          });
        });
      });
    }

  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>
yzckvree

yzckvree1#

this.url 未定义。你从来没有在你的代码里设置过。
将其添加到 MarkerOptions 对象:

var marker = new google.maps.Marker({
  map: map,
  position: point,
  label: icon.label,
  url: url
});
marker.addListener('click', function() {      
  infoWindow.setContent(infowincontent);
  infoWindow.open(map, marker);
  console.log("marker click, this.url="+this.url);
  if (!!this.url) {
    window.location.href = this.url;
  }
});

相关问题