EastCoastGreenwayAlliance / ecg-map

Interactive map and trip planner for the ECGA
https://map.greenway.org
7 stars 0 forks source link

Routing & UX - break out nearest-segment form routing between segments #13

Closed clhenrick closed 7 years ago

clhenrick commented 7 years ago

The UX flow for routing is as follows:

  1. User searches for a location
  2. App displays the result and shows the user the nearest ECG segment point to it
  3. User chooses this as a start point and wanders either north or south; OR user chooses to search for an endpoint
  4. If the latter, then step 2 happens again
  5. If the former the map zooms & pans to that location on the ECG

So we will have to break out some of the routing logic for finding the nearest ECG segment to a geocoded search.

cc @gregallensworth

clhenrick commented 7 years ago

Some UI / UX mocks for reference:

4-start-search

5-start-accept

6-end-search

7-full-route

gregallensworth commented 7 years ago

See the new function findNearestSegmentToLatLng() which should do the first of these: asynchronously find the nearest segment to a given latlng, and return it to your callback. This should be suitable for selection of points by location.

gregallensworth commented 7 years ago

Segments returned by findNearestSegmentToLatLng() now include closest_distance in addition to the lat, lng, id, and title. This saves some code on the caller's side of calculating the distance, and of storing the selected point separately in state.

The structure now includes metadata (a properties on the document itself) of the actual and desired starting and ending points, the distance from the requested points and trail points, and the total mileage. This is documented in the code, and the demo shows their usage in Leaflet.