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

Question

我有一个折线列表，就像谷歌地图在这里，当我点击折线时，我希望信息窗口出现在我点击的位置，这个函数可以很好地实现这个功能。

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

问题出现在我点击列表时（使用相同的函数），显然事件没有latLng，但我仍希望infowindow像在Google地图链接中单击列表时一样显示在折线的中间位置。我之前提到的。

尝试过LatLngBounds(); 但这给出的是折线创建区域的实际中心，而不是我需要的中间位置。

有任何想法吗？

- fxck

---

我没有现成的解决方案，但这是一个线索：（http://rbrundritt.wordpress.com/2008/10/14/calculate-midpoint-of-polyline/）如果你把解决方案发布为答案，将不胜感激。干杯。 - dmitry

其实我主要是想知道API本身是否能够帮助解决这个问题...显然它并不能。我会看一下那个链接，谢谢。 - fxck

算法寻找不规则多边形重心和标签点的更多线索。 - fxck

我认为它应该是折线的中间点，而不是多边形的重心。这两者并不相同。 - dmitry

而且，我正在尝试维护gmaps v3的扩展，你的google.maps.Polyline.getMidPoint()代码将非常有用。当然，如果你愿意编写它的话 :) - dmitry

Answer 1

所以这是（有点巧妙的）解决方案。

使用http://www.geocodezip.com/scripts/v3_epoly.js库，计算您的折线总长度（有多种方式），将其分成两半，并调用epoly的.GetPointsAtDistance()函数。

这应该返回LatLng点，但有时会表现出一些奇怪的行为，返回两个点甚至有些“损坏”的点。因此，您可以做的最安全的事情可能是这样的：

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

还不错，总比没有好。

- fxck

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

- Shane Best

---

那么请尝试更好地表达你的问题。 - Shane Best

我刚才给你的链接也在第一篇帖子中 ;) 大多数其他帖子也指出它不是一条直线 http://img62.imageshack.us/img62/2145/nonot.png - fxck

如果 {"geodesic": false}，这将起作用，但当 "geodesic" 设置为 true 时，我们有办法找到折线的中点吗？ - Rahul R

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()中找出它们。

- duncan

---

如果我真的想要这样做，不确定哪种方法更好，这需要你包含另一个库，而LatLngBounds()则需要你收集所有latLngs的数组并调用getCenter()函数，很难说哪种更有效 :) - fxck

尝试使用computeLength()函数，并将折线的完整路径传递给它。 - duncan

好的，computeLength()是什么函数，那个几何库的吗？编辑：是的，但那只是计算路径长度的，它怎么可能有帮助呢？ - fxck

所以，你想找到路径中间的点。首先，你需要知道路径有多长。一旦你知道了，就把它除以二。然后，你必须以某种方式遍历你的路径，直到你从起点到达那个距离。 - duncan

我该如何遍历它？我可以遍历由折线组成的点，但这并不一定给我想要的实际中心（想象一下只有两个点的折线）。 - fxck

Answer 4

可能有点过时了，但为什么不在点击时添加信息框呢？

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

如果是点击的话。

- Richard Housham

Answer 5

要获取折线的坐标，您应该执行以下操作：

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();

- Jefferson Maretti

---

已经过去四年或更长时间了，我想现在肯定有更好的方法来做这件事。 - fxck