Javascript 在路线上使用mousemove获取鼠标坐标

Javascript 在路线上使用mousemove获取鼠标坐标,javascript,google-maps,google-maps-api-3,Javascript,Google Maps,Google Maps Api 3,在普通谷歌地图上,我可以使用以下代码获取并显示鼠标点的地理坐标: google.maps.event.addListener(map, "mousemove", function(event) { document.getElementById('message').innerHTML = 'Geographical Coordinates: ' + event.latLng.lat() + ', ' + event.latLng.lng(); }); 如果我使用google dire

在普通谷歌地图上,我可以使用以下代码获取并显示鼠标点的地理坐标:

google.maps.event.addListener(map, "mousemove", function(event) {
  document.getElementById('message').innerHTML =
  'Geographical Coordinates: ' + event.latLng.lat() + ', ' + event.latLng.lng();
});
如果我使用google directions api计算路线并将鼠标移到显示的路线上,则不会触发“mousemove”事件。当鼠标指针在路线上时,我如何获得坐标


我有一个正在运行的示例。当您使用鼠标沿路线移动时,坐标不会更新。

我所知道的向路线本身添加鼠标悬停事件的唯一方法是绘制多段线(以便您可以访问它),然后向其添加鼠标悬停事件


这是一个在光标位置移动引导工具提示的示例:

    google.maps.event.addListener(poly,"mousemove",function(e){

        var _tooltipPolys = $("#tooltipPolys");
        if(_tooltipPolys.length == 0) {
            _tooltipPolys = $(' \
                <div id="tooltipPolys" class="tooltip top" role="tooltip"> \
                    <div class="tooltip-arrow"></div> \
                    <div class="tooltip-inner"></div> \
                </div> \
            ');
            $("body").append(_tooltipPolys);
            $("div.tooltip-inner", _tooltipPolys).text(this.title);
            _tooltipPolys.css({
                "opacity": ".9",
                "position":"absolute"
            });
        }

        var pageX = event.pageX;
        var pageY = event.pageY;
        if (pageX === undefined) {
            pageX = event.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
            pageY = event.clientY + document.body.scrollTop + document.documentElement.scrollTop;
        }

        // Update the current tooltip position each time the cursor moves
        _tooltipPolys.css({
            "top":(pageY - _tooltipPolys.height() - 10)+"px",
            "left":(pageX - (_tooltipPolys.width() / 2))+"px"
        });
    });
google.maps.event.addListener(poly,“mousemove”,函数(e){
var#ToolTipolys=$(“#ToolTipolys”);
如果(_tooltipPolys.length==0){
_ToolTipolys=$('\
\
\
\
\
');
$(“正文”)。附加(\u ToolTipolys);
$(“div.tooltip-internal”,_tooltipPolys).text(此.title);
_ToolTipolys.css({
“不透明度”:“.9”,
“位置”:“绝对”
});
}
var pageX=event.pageX;
var pageY=event.pageY;
如果(pageX==未定义){
pageX=event.clientX+document.body.scrollLeft+document.documentElement.scrollLeft;
pageY=event.clientY+document.body.scrollTop+document.documentElement.scrollTop;
}
//每次光标移动时更新当前工具提示位置
_ToolTipolys.css({
“顶部”:(pageY-_tooltipPolys.height()-10)+“px”,
“左”:(pageX-(_tooltipPolys.width()/2))+“px”
});
});

你能发布一些代码吗,试试jsfiddle.netI在上做了一个小例子,很抱歉,我的例子中没有包含渲染选项
draggable:true
。使用选项
suppressPolylines:true
时,路线将无法拖动。我认为您无法同时获得鼠标悬停方向上的鼠标坐标和可拖动方向。