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

2019-12-08 20:36:07 阅读：303 来源： 互联网

标签：google-maps google-maps-api-3 javascript

我正在使用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

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

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