使用javascript或jquery的几何（CONVOLUTION）函数 [英] Geometry (CONVOLUTION) function with javascript or jquery
问题描述
我尝试这样做3个月 - 我需要按照路线方向创建一个多边形，如下所示：
所以我写这个：
p> 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查询失败：+状态）;
}
}）;
但是在某些情况下，在某些情况下是不错的，所以我的代码产生了这个结果：
BAD病例：
好的情况： strong>
那么我怎么能解决这个问题，以便通过路线方向获得漂亮的多边形？是否有人有想法？
我如何在我的代码中实现这一点：
卷积算法
有没有解决方案可以解决我的问题？
有没有其他办法可以创建我需要的？
生成第二个图像的算法在几何上非常简单。我会给你写一些伪代码，假设你有一个x，y数组的数组：
coordinates = [[x1，y1 ]，[x2，y2] ... [xn，yn]]
leftcoords = []
rightcoords = []
projectionwidth = 1＃路径宽度是多少
为坐标中的每个坐标：
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）
您必须在路径末尾谨慎选择前后坐标，但您明白了。你最终得到三组坐标轨迹。如果你想平滑路径，你可以将它设置为平均数点。
好的，这里有代码可行，但你必须做有些工作可以将其平滑化，以解决路径中的抖动问题。我的建议是平均以前的几个点数，或者只是多拿回几点。
I try to do this 3 months - I need to create a polygon by route direction like here:
so so I write this:
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);
}
});
but in some cases is good in some cases not, so my code produce this:
BAD case:
GOOD case:
So how I can solve this problem to get nice polygon by route direction ??? Does someody have idea?
How I can implement this into my code:
CONVOLUTION ALGORITHM
Is there any solution for my problem?
Is there some other way than this to create what I need?
The algorithm to produce the second image is quite simple geometrically. I'll write you some pseudocode, assuming you have an array of x,y arrays:
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)
You have to take care at the end of the path to only choose coordinates ahead or behind, but you get the idea. You end up with three sets of coordinate trajectories. You can set it up to average several points if you'd like to smooth the path.
Ok, so here is code that works, but you'll have to do some work to smooth it out to account for the jitter in the path. My suggestion would be to average several previous points, or just grab a point several back.
这篇关于使用javascript或jquery的几何（CONVOLUTION）函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
