0

I am using the Google Maps Directions Service to request a path from a start point to an end point. This obviously returns a list of Lat/Lng markers which are joined to draw a path. The code looks like this:

  directionsService.route(request, function(result, status) {
    if (status == 'OK') {
      directionsDisplay.setDirections(result);
      var myRoute = result.routes[0].legs[0];
      //console.log(myRoute);

      for (var i = 0; i < myRoute.steps.length; i++) {
      var marker = new google.maps.Marker({
        position: myRoute.steps[i].start_point,
        map: map
      });
      console.log(myRoute.steps[i].start_point.lat(),myRoute.steps[i].start_point.lng() );
      attachInstructionText(marker, myRoute.steps[i].instructions);
      markerArray[i] = marker;
  }

    }
  });

enter image description here

I am having trouble figuring out an algorithm which will generate more Lat/Lng 'markers' between the existing ones.

To visualize this even further here is another diagram. Red X's show the points that the call returns. I have then added Blue X's on-top to show what I want the result to look like. enter image description here

Thanks!!!

mostamazingname
  • 153
  • 1
  • 1
  • 12
  • How many points to you want? Can you use the existing points (from the polyline)? Any restrictions on the distance between them? – geocodezip May 12 '18 at 19:58
  • If the line between the points is straight, then the calculation should be relatively straightforward, but if the line is curved such as in your first image, it'll be a lot trickier. – CertainPerformance May 12 '18 at 20:36
  • @geocodezip no restrictions just need more than the ones already provided. more can mean anything from 1 to as many as possible – mostamazingname May 12 '18 at 22:08
  • @CertainPerformance thats what i was thinking. any idea what the calculation would actually look like though? im assuming similar to just distance between two lat/lng – mostamazingname May 12 '18 at 22:08
  • Use each of the points in the returned polyline then, currently you are just using the start of each step. – geocodezip May 12 '18 at 22:15
  • 1
    possible duplicate of [Get a polyline from Google maps directions V3](https://stackoverflow.com/questions/38709732/use-google-maps-api-to-draw-a-polyline-that-changes-color) – geocodezip May 12 '18 at 22:16
  • @geocodezip your advice should be the correct answer! There was some confusion with how many lat/lng are on a polyline from Google. That was mainly my confusion and now that I've found how to access all the lat/lng this is such a simpler problem. Thanks for the heads up on the start of each step!! – mostamazingname May 13 '18 at 12:47

1 Answers1

0

For each line connecting the red points:

Use this function to determine the distance between the two points. Figure out how close together you want the blue Xs to be - for example, 30m? 50m? Variable depending on zoom? Using that, determine how many new points you want to come up with between the two endpoints. Then, for each lat/lng, divide the difference between the endpoints by (new points + 1) to come up with how much lat/lng difference each new point should have.

For example: Start with endpoints

Lat 100, Lng 80

and

Lat 110, Lng 60

(distance too large, but this is just an example) Say you do a calculation and find that you need 4 additional points. Latitude difference between each point would be:

(110 - 100) / (4 + 1) = 10 / 5 = 2

Latitude difference between each point would be:

(60 - 80) / (4 + 1) = -20 / 5 = -4

Generate 4 new points, using those differences to calculate their lat/lng:

(100, 80) (start)
(102, 76)
(104, 72)
(106, 68)
(108, 64)
(110, 60) (end)
CertainPerformance
  • 356,069
  • 52
  • 309
  • 320