Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/google-maps/4.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 点击kml标记';s信息窗口,用于DirectionsService()_Javascript_Google Maps_Kml_Marker_Infowindow - Fatal编程技术网

Javascript 点击kml标记';s信息窗口,用于DirectionsService()

Javascript 点击kml标记';s信息窗口,用于DirectionsService(),javascript,google-maps,kml,marker,infowindow,Javascript,Google Maps,Kml,Marker,Infowindow,我有一个简单的JS脚本,通过读取带有PlaceMarker列表的kml文件,在google地图上显示标记,并显示用户的当前位置。 默认情况下,单击标记会在信息窗口中显示每个placemark的名称和说明 我的问题是如何添加一个选项来运行方向服务。路由(directionrequest,…)任何选定的标记都是目的地,当前位置是起点(双击标记或在信息窗口中添加链接似乎是最直观的方式,但可能有人有更好的想法) 以下是当前的基本JS脚本(现在可以正常工作,使用调用API,但它消除了只查看标记信息的可能性

我有一个简单的JS脚本,通过读取带有PlaceMarker列表的kml文件,在google地图上显示标记,并显示用户的当前位置。 默认情况下,单击标记会在
信息窗口中显示每个placemark的名称和说明

我的问题是如何添加一个选项来运行
方向服务。路由(directionrequest,…)
任何选定的标记都是目的地,当前位置是起点(双击标记或在
信息窗口中添加链接似乎是最直观的方式,但可能有人有更好的想法)

以下是当前的基本JS脚本(现在可以正常工作,使用调用API,但它消除了只查看标记信息的可能性,因为单击标记会立即触发路线渲染):

然后通过单击任何kml标记获取latLng,以显示要遵循的路线,但我希望使用“单击”以外的另一个选项,以保持在不触发路线的情况下查看infowindows数据的可能性(如果我在下面的
addListener
事件中放置“dblClick”,它仍然只会放大):

有没有一个简单的方法可以做到这一点?我希望保留用于读取每个标记的数据的“单击”事件和“dblClick”事件,或在
信息窗口中添加的链接,以触发
方向请求
,我希望保持简单。

不支持双击事件(它支持的唯一鼠标事件是单击)

一个选项是在信息窗口中向呈现的HTML添加“获取方向”链接,然后使用该点击事件的
事件。latLng
作为目标:

ctaLayer.addListener("click", function(event) {
  infowindow.setContent(event.featureData.infoWindowHtml+"<br><a href='javascript:getDirections("+event.latLng.toUrlValue(6)+");'>get directions</a>");
  infowindow.setOptions({pixelOffset: event.pixelOffset});
  infowindow.setPosition(event.latLng);
  infowindow.open(map);
});

function getDirections(lat, lng) {
  start = pos_infowindow.getPosition(); // current position as defined in the geolocation function
  var latLng = new google.maps.LatLng(lat, lng);
  destination = latLng; // position of the marker clicked, as defined by the kml file
  var directionsService = new google.maps.DirectionsService();
  var directionsRequest = {
    origin: start,
    destination: destination,
    travelMode: google.maps.DirectionsTravelMode.DRIVING,
    unitSystem: google.maps.UnitSystem.METRIC
  };
  directionsService.route(directionsRequest, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay.setDirections(response);
    } else
      alert('Directions Request failed: ' + status);
  });
}


发布的代码包含语法错误(
pos\u infowindow
不是构造函数)。请提供一个演示您的问题的示例。对不起,我想知道为什么不再有地理定位了!经过一些更正后,我得到状态“REQUEST_DENIED”,因此
DirectionsRenderer
未应用。(我也知道Firefox不接受没有SSL/https的
navigator.geolocation.watchPosition
)。这些听起来像是完全不同的问题,已经有答案了。这不是一个不同的问题,我想通过双击一个标记来呈现这条路线(无论如何都不会触发),或者单击信息窗口中的链接。我刚刚发布了这段代码,作为我正在尝试做的一个示例。如果太复杂,没问题!你能添加kml数据吗?如果是实时的,你能添加一个链接吗?
if (pos) google.maps.event.addListener(ctaLayer, 'click', function(kmlEvent) {
    var name_marker = kmlEvent.featureData.name;
    var text_marker = kmlEvent.featureData.description;
    var pos_marker = kmlEvent.latLng;
    var offset_marker = kmlEvent.pixelOffset;
    var directionsService = new google.maps.DirectionsService();
    var directionsRequest = {
    origin: pos,
    destination: pos_marker,
    travelMode: google.maps.DirectionsTravelMode.DRIVING,
    unitSystem: google.maps.UnitSystem.METRIC
    };
    // alert('start ' + pos + ' destination ' + pos_marker);
    directionsService.route( directionsRequest, function(response, status)
    {
        if (status == google.maps.DirectionsStatus.OK)
        {
            new google.maps.DirectionsRenderer({
                map: map,
                directions: response
            });
        }
        else{
  // alert ('problem');
        }
    }); 
});
ctaLayer.addListener("click", function(event) {
  infowindow.setContent(event.featureData.infoWindowHtml+"<br><a href='javascript:getDirections("+event.latLng.toUrlValue(6)+");'>get directions</a>");
  infowindow.setOptions({pixelOffset: event.pixelOffset});
  infowindow.setPosition(event.latLng);
  infowindow.open(map);
});

function getDirections(lat, lng) {
  start = pos_infowindow.getPosition(); // current position as defined in the geolocation function
  var latLng = new google.maps.LatLng(lat, lng);
  destination = latLng; // position of the marker clicked, as defined by the kml file
  var directionsService = new google.maps.DirectionsService();
  var directionsRequest = {
    origin: start,
    destination: destination,
    travelMode: google.maps.DirectionsTravelMode.DRIVING,
    unitSystem: google.maps.UnitSystem.METRIC
  };
  directionsService.route(directionsRequest, function(response, status) {
    if (status == google.maps.DirectionsStatus.OK) {
      directionsDisplay.setDirections(response);
    } else
      alert('Directions Request failed: ' + status);
  });
}