I have a Google map embedded on a Blazor component. This is generated by the BlazorGoogleMaps package. My users can draw a path (set of connected lines) and search for results within a specified distance from that line. That all works fine.
What I would like to do is draw a polygon that shows the user the area that is being searched. I have a method that will generate a polygon (rectangle to be precise) that encompasses the area for a line...
I know there should also be semi-circles at each end of the rectangle. I'm having separate woes with that, so will ignore it for this question.
As you can see, when they just draw one single line, it displays fine.
However, if I do this for a path consisting of multiple lines, then the opacity is increased in the places where the rectangles overlap...
This seems to be a very well-known problem, and all the solutions I could find seem to come down to one of the methods shown in this post. That question was about circles, but the principle is the same.
The problem is that if I mimic the method for combining the polygons (getting the points and creating a new polygon with them as vertices), then the resulting polygon is not correct. My code is as follows...
List<Polygon> polygons = []; // Code to generate polygons ommittedList<LatLngLiteral> corridorPoints = [];foreach (Polygon polygon in polygons) { corridorPoints.AddRange(await polygon.GetPath());}...however, the results are wrong....
As you can see, there is an area (surrounded highlighted by the red triangle) that should not be included. Also, there should be an edge that goes from the point marked "1" on the map to the point marked "2". However, if you look carefully, the edge actually goes to the point marked "3", which is why it goes a little south of point 2.
Anyone able to advise how I handle this?