我尝试这样做 3 个月 - 我需要按路线方向创建一个多边形,如下所示:
所以我写这个:
directionService.route(request, function(result, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsRenderer.setDirections(result);
var r = [];
var z = 0.5;
var bla = result.routes[0].overview_path;
for(var i=0 in result.routes[0].overview_path) {
r.push(new google.maps.LatLng(bla[i].lat()+z, bla[i].lng()-z));
}
bla.reverse();
for(var x=0 in bla) {
r.push(new google.maps.LatLng(bla[x].lat()-z, bla[x].lng()+z));
}
var prva = new google.maps.Polyline({
path: result.routes[0].overview_path,
strokeColor: "#00000",
strokeOpacity: 1.0,
strokeWeight: 2
});
prva.setMap(map);
druga = new google.maps.Polygon({
paths: r,
strokeColor: "#FF0000",
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: "#FF0000",
fillOpacity: 0.35
});
druga.setMap(map);
} else {
alert("Directions query failed: " + status);
}
});
但在某些情况下很好,在某些情况下则不然,所以我的代码会产生以下结果:
BAD case:
好案例:
那么我如何解决这个问题以通过路线方向获得漂亮的多边形???有人有想法吗?
我如何将其实现到我的代码中:
卷积算法
我的问题有什么解决办法吗?
除了这之外还有其他方法来创建我需要的东西吗?
生成第二张图像的算法在几何上非常简单。假设您有一个 x,y 数组数组,我将为您编写一些伪代码:
coordinates = [[x1,y1],[x2,y2] ... [xn,yn]]
leftcoords = []
rightcoords = []
projectionwidth = 1 # How wide the path is
for each coordinate in coordinates:
pathvector = coordinate(index + 1) - coordinate(index - 1)
normpathvector = pathvector/(length(pathvector))
perpvector = projectionwidth*[-normpathvector[1],normpathvector[0]]
leftcoords.append(coordinate + perpvector)
rightcoords.append(coordinate - perpvector)
您必须在路径末端小心,只选择前面或后面的坐标,但您明白了。您最终会得到三组坐标轨迹。如果您想平滑路径,可以将其设置为对多个点进行平均。
好的,这里是有效的代码,但是您必须做一些工作来平滑它,以解决路径中的抖动。我的建议是对之前的几个点进行平均,或者只是抓住几个后面的点。
http://jsbin.com/uTATePe/2/ http://jsbin.com/uTATePe/2/
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)