【问题标题】:google maps click on marker to open URL from a database谷歌地图点击标记从数据库中打开 URL
【发布时间】:2016-06-15 14:39:06
【问题描述】:

我正在尝试让地图在地图上显示景点。这些标记是从数据库中提取出来的,并放在地图上。但是,我想在单击正确的标记后显示一个网站(放入数据库中)。我得到了打开不同页面的代码,但是,它只显示了数据库表中最后一行的 ID/URL。我怎样才能使它显示每个位置的 URL 或 ID 而不仅仅是最后一个位置?

我现在的代码:

    function load() {
    var map = new google.maps.Map(document.getElementById("map"), {
      //defining the location
    center: new google.maps.LatLng(45.466963, 9.188733),
    //defining default map zoom
    zoom: 14,
    //disable scroll wheel function
    scrollwheel: false,
    //disable navigation control
    navigationControl: false,
    //disable map type control
    mapTypeControl: false,
    //disable scaling function
    scaleControl: false,
    //allowing the map to be dragable
    draggable: true,
    //disable user interface e.g. + and - buttons for zoom control
    disableDefaultUI: true

  });
  //creates window that contains defined information
    infoWindow = new google.maps.InfoWindow;


  //pulling the data from the file
  downloadUrl("phpsqlajax_genxml2.php", function(data) {

     //defining variables using data pulled over


    var xml = data.responseXML;
    var markers = xml.documentElement.getElementsByTagName("marker");
    for (var i = 1; 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 idd = markers[i].getAttribute("identity");
        var icon = customIcons[type] || {};
        var marker = new google.maps.Marker({
            map: map,
            position: point,
            icon: icon.icon
        });
      //when marker is clicked, it opens the URL of the location
      bindInfoWindow(marker, map, infoWindow, html);
              google.maps.event.addListener(marker, 'click', function () {
                        window.open(idd, '_blank');
                        }); 
    }
  });
}

我尝试了几个选项都无济于事,如果我需要提供更多信息,请说出来,我陷入了僵局

【问题讨论】:

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


    【解决方案1】:

    您应该保存每个标记的“身份”值。您可以在构建标记时将自定义数据添加到标记中:

    var marker = new google.maps.Marker({
            map: map,
            position: point,
            icon: icon.icon,
            idd:idd
        });
    

    那么监听器应该使用这个新属性:

    google.maps.event.addListener(marker, 'click', function () {
         window.open(this.idd, '_blank');
    }); 
    

    【讨论】:

      猜你喜欢
      • 2021-07-23
      • 2012-09-27
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-11-03
      • 2017-10-20
      相关资源
      最近更新 更多