javascript-从多义线获取事件或从DirectionsRenderer获取标记

我正在使用DirectionsService和route方法生成DirectionsResult.我还使用DirectionsRenderer对象显示结果,因为它非常易于使用.我没有检测到directions_changed事件的问题,但是我想知道是否有可能从代表行程的折线中获取事件,甚至从拖动折线后生成的标记(小圆圈)中获取事件.

使用google地图(maps.google.com,“获取路线”)时,您可以拖动折线,右键单击折线(或标记),以显示菜单.因此,我想有一种方法可以从DirectionsRenderer捕获事件(假设Google在这种情况下使用此对象).

如果有人知道

解决方法:

我也在寻找您问题的答案.在此之前,我会尝试自己解决问题,如果发现有用的内容,我会回发.

更新：使用JavaScript几分钟后,我发现DirectionsResult对象包含一个航点数组,包括当用光标拖动路径时创建的航点.如果完成了Draggable Directions tutorial,则可以通过directions_changed事件的回调方法内的directionsDisplay.directions访问该对象.该对象拥有一个名为sf的成员,该成员拥有一个Waypoints数组(如果存在),如果没有,则为null.该数组的每个成员都包含一个名为location的成员,该坐标存储wa(纬度)和ya(经度)下的坐标.

为了演示航点处理,我编写了一个小函数来显示标记,以代替航点.为了对其进行测试,请在脚本中添加以下全局变量；

var markers = [];  

修改directions_changed事件回调函数

google.maps.event.addListener(directionsDisplay, 'directions_changed', function() {  
    computeTotalDistance(directionsDisplay.directions);  
});

以下内容；

google.maps.event.addListener(directionsDisplay, 'directions_changed', function() {  
    computeTotalDistance(directionsDisplay.directions);  
    displayWaypoints(directionsDisplay.directions);  
});

并添加此功能

function displayWaypoints(result) {  
    for (var i = 0; i < markers.length; ++i) {  
        markers[i].setMap(null);  
    }  
    markers = [];  
    if (result.sf.waypoints) {  
            for (var i = 0; i < result.sf.waypoints.length; ++i) {  
                    var latitude = result.sf.waypoints[i].location.wa;  
                    var longitude = result.sf.waypoints[i].location.ya;    
                    markers.push(new google.maps.Marker({  
                            position: new google.maps.LatLng(latitude, longitude),  
                            map: map  
                    }));  
            }  
    }  
}  

您可能还希望隐藏DirectionsRenderer的内置标记绘图.
更换

var rendererOptions = {  
    draggable: true  
};  

与以下

var rendererOptions = {  
    draggable: true,  
    suppressMarkers: true  
};  

我找不到对该SF成员的任何官方引用.使用它需要您自担风险,Google可能会修改API,恕不另行通知.在拖动方向后,除非他们提供用于操纵路标的公共API,否则我想不出更好的解决方案.

这是我的第一个Stack Overflow答案,希望对我有所帮助.

亲切的问候,
强尼

标签：google-maps,google-maps-api-3,javascript
来源： https://codeday.me/bug/20191208/2094025.html