Question

我有一个折线列表，就像谷歌地图does一样，当我点击折线时我希望信息窗口显示在我点击的位置，并且它可以正常使用此功能

function mapsInfoWindow(polyline, content) {
    google.maps.event.addListener(polyline, 'click', function(event) {            
        infowindow.content = content;
        infowindow.position = event.latLng;
        infowindow.open(map);
    });
}

当我点击列表时出现问题（使用相同的功能），事件显然没有 latLng ，但我想要信息窗口无论如何都要显示在折线的中间，就像点击谷歌地图链接I mentioned before中的列表一样。

尝试LatLngBounds（）;但是这给了折线创建的区域的实际中心，而不是我需要的中间区域。

知道该怎么做吗？

Answer 1

所以这就是（有点hacky）解决方案。

使用http://www.geocodezip.com/scripts/v3_epoly.js库，然后计算折线的总长度（各种方式），将其除以一半并调用epoly的.GetPointsAtDistance（）函数。

这应该返回LatLng点，但它有时会有点怪异，返回两点甚至以某种方式转向那个点＃34;破坏＆＃34;。所以你可以做的最安全的事情可能就是：

var pointInHalf = polyline.GetPointsAtDistance(polylineLength);
var pointCoordinate = new google.maps.LatLng(pointInHalf[0].lat(), pointInHalf[0].lng());

嗯，总比没有好。

Answer 2

来自http://www.geocodezip.com/v3_polyline_example_geodesic_proj.html

没有扩展并假设折线是一条直线。

可以将纬度/经度坐标转换为点平面（x，y）位置，并计算两者之间的平均值。这将为您提供一个中心像素位置。然后，您可以将此位置转换回latlng以进行地图绘制。

var startLatLng = startMarker.getPosition(); 
var endLatLng = endMarker.getPosition(); 
var startPoint = projection.fromLatLngToPoint(startLatLng); 
var endPoint = projection.fromLatLngToPoint(endLatLng); 
// Average 
var midPoint = new google.maps.Point( 
    (startPoint.x + endPoint.x) / 2, 
    (startPoint.y + endPoint.y) / 2); 
// Unproject 
var midLatLng = projection.fromPointToLatLng(midPoint); 
var midMarker = createMarker(midLatLng, "text");

有关更改投影的更多信息http://code.google.com/apis/maps/documentation/javascript/reference.html#Projection

Answer 3

首先，您需要使用计算距离的几何库。将libraries = geometry添加到JS调用中，例如

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?libraries=geometry"></script>

假设您知道折线的起点和终点，您应该可以这样做：

var inBetween = google.maps.geometry.spherical.interpolate(startLatlng, endLatlng, 0.5);  
infowindow.position = inBetween;

我想如果您还不知道起点和终点，可以从polyline.getPath（）中解决。

Answer 4

获取你应该做的折线的坐标：

var widePath = new google.maps.Polyline({
path: waypointsCoordinates,
strokeColor: '#3366FF',
strokeOpacity: 0.0,
editable: true,
draggable: true,                       
strokeWeight: 3
});

并且做：

var latLng [];
latLng = widePath.getPath().getArray();

Answer 5

也可能有点旧，但为什么不在点击上添加信息框？

infowindow.setPosition(event.latLng);
infowindow.open(this.getMap());

如果是点击次数。

谷歌地图中间的折线（质心？）

5 个答案: