如何獲得由getroute生成的標記的onclick事件

在這個jsfiddle是我的js的簡化版本：http://jsfiddle.net/Drecker/2m4kvxb8/4/請注意，有趣的部分jsfiddle只有showRoute方法。並且方法showMarker僅在正常標記上顯示期望的行爲。如何獲得由getroute生成的標記的onclick事件

基本上我通過gmap3getroute生成一個路線與一些路標。點擊航點後，我需要打開一個包含更多自定義信息的小型信息框 - 這樣基本上可以獲得這種航點的onclick事件（帶有某個航點的標識，這樣我就可以獲得適當的信息）。我可以在單獨的標記上實現所需的行爲（如您在jsfiddle中所看到的那樣 - 這是左上角的功能齊全的獨立標記），但不是由directionrenderer生成的標記。

此外請注意，我的航點有stopover: false，這種標記出於某種原因會忽略（某些）選項，如title，正如您在jsfiddle中所看到的。

任何幫助是非常讚賞 - 我已經嘗試了幾件事情，他們都沒有工作。

來源

2014-09-22 Drecker

你見過[this]（http://stackoverflow.com/questions/6630341/detect-waypoint-click-on-directionsrenderer-marker-in-google-maps-v3） – 2014-09-25 08:58:00

@eskimo - 我沒有，我試圖谷歌我的問題，但顯然不夠硬...... – Drecker 2014-09-25 10:35:50

^我記得以前讀過它，但我仍然努力尋找它 – 2014-09-25 11:15:38

有沒有這樣的選項，根據文檔和這裏的很多類似的問題在stackoverflow上，你不能將點擊動作綁定到路點。

我有解決這個問題的方法。主要想法是添加標記而不是航點並更改其圖標。標記有更多的選擇比航點。所以我刪除了航點並添加了標記。請注意，您必須添加標記的位置時

選項，而不航點要更精確：

options: {origin: {lat:49.9, lng: 14.9}, 
      destination: {lat: 50.1, lng: 15.1}, 
      travelMode: google.maps.DirectionsTravelMode.DRIVING 
     },

添加了一個新的圖標標記，然後單擊事件：

marker:{ 
    values:[ 
     {latLng:[49.96485, 14.88392], data:"Waypoint1", options:{icon: "http://mt.google.com/vt/icon/name=icons/spotlight/directions_transfer_icon_10px.png&scale=1"}}, 
     {latLng:[49.97730, 14.88185], data:"Waypoint2", options:{icon: "http://mt.google.com/vt/icon/name=icons/spotlight/directions_transfer_icon_10px.png&scale=1"}} 
    ], 
    options:{ 
     draggable: false 
    }, 
    events:{ 
     click: function(marker, event, context){ 
     var map = $(this).gmap3("get"), 
      infowindow = $(this).gmap3({get:{name:"infowindow"}}); 
     if (infowindow){ 
      infowindow.open(map, marker); 
      infowindow.setContent(context.data); 
     } else { 
      $(this).gmap3({ 
      infowindow:{ 
       anchor:marker, 
       options:{content: context.data} 
      } 
      }); 
     } 
     } 
    } 
    }

這裏是我的解決辦法那個問題：DEMO

來源

2014-09-25 10:06:28 Sasa

感謝您的回答，但我有點失望，沒有更清潔的解決方案 – Drecker 2014-09-25 10:34:48

希望您使用的是谷歌的API庫的一些版本中，情況是這樣的

<script src="http://maps.googleapis.com/maps/api/js?sensor=false&amp;libraries=places,geometry" type="text/javascript"></script>

你有一米格的空間來顯示地圖，說

<div id="map" style="width: 700px; height: 600px;"></div>

所以，你可以使用這個對標記添加的偵聽

//location is an array variable where you store your co ordinates 
//code to show map 
var map = new google.maps.Map(document.getElementById('map'), { 
       zoom: 10, 
       center: new google.maps.LatLng(locations[0].latitude, locations[0].longitude), 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      }); 
//adding listener 
var marker,i; 
var infowindow = new google.maps.InfoWindow(); 
google.maps.event.addListener(marker, 'click', (function (marker, i) { 
        return function() { 
         infowindow.setContent(locations[i].city); 
         infowindow.open(map, marker); 
        } 
       })(marker, i));

其中

標記是，這將是這樣的varible，從上面你有一些想法

//adding marker 
for (i = 0; i < locations.length; i++) { 
       marker = new google.maps.Marker({ 
        position: new google.maps.LatLng(locations[i].latitude, locations[i].longitude), 
        map: map 
       });

希望，也許對你有所幫助您的問題

來源

2014-09-25 09:03:19 ajitksharma

如何獲得由getroute生成的標記的onclick事件

回答

相關問題