Git Product home page Git Product logo

Comments (9)

GabeConsalter avatar GabeConsalter commented on May 22, 2024 2

Hi @tuononh, how can I use the legs?

from react-native-maps-directions.

bramus avatar bramus commented on May 22, 2024 2

FYI: With version 1.7.3 you can pass a precision into react-native-maps-directions.

  • Setting it to "low" will draw the overview_polyline (which is an approximation of the route).
  • Setting it to "high" will draw a detailed polyline that should snap on the roads perfectly

Note that setting it to "high" will most likely cause a hit in rendering performance as many parts needs to be drawn …

from react-native-maps-directions.

3210jr avatar 3210jr commented on May 22, 2024 1

Hey @bramus ! I have the same question. It seems the route does not snap to the road. It looks great when zoomed out but when zoomed in further, it looks really "choppy". See the screenshots below:
screen shot 2018-06-08 at 8 15 03 am

screen shot 2018-06-08 at 8 15 38 am

from react-native-maps-directions.

tuononh avatar tuononh commented on May 22, 2024 1

@bramus Look like you are using overview polyline. You should use the legs

from react-native-maps-directions.

bramus avatar bramus commented on May 22, 2024

This component uses routing capabilities provided by Google. They already pre-snap the data onto roads. Could you elaborate a bit more what exactly you're suggesting?

from react-native-maps-directions.

bramus avatar bramus commented on May 22, 2024

Closing due to inactivity / insufficient information.

Feel free to add some more info and I'll gladly reopen.

from react-native-maps-directions.

bramus avatar bramus commented on May 22, 2024

The components responsible for rendering the route – both from react-native-maps-directions and react-native-maps – just render the data that Google returns. These components don't snap the polyline on the road, it's Google that pre-snaps the returned route onto the road (because that's how a routing engine works).

This explains why there are differences between the roads and the route on iOS when using Apple Maps on iOS: Apple Maps has some minor differences when compared to Google Maps. The route snaps onto Google's data, not Apple's data.

But that however doesn't explain the behavior as showcased above: it's a Google Maps map, with a Google Maps route.

So what might be going on here? There's a few guesses to why that might be:

  1. The Google Directions API uses a different dataset than Google Maps.
  2. The Google Directions API isn't that precise when it needs to calculate a long route.

The first option seems unplausible, but the second guess seems really plausible as the route pictured above spans a really huge area: Google doesn't add that much detail to the route as it spans an entire country.

This can be tested:

  • Fetch a lengthy route between A to B
  • Zoom into a section where the route diverges from the road
  • Now fetch a route around that area

In the example above that would be a route around the Zinga area. My bet is that when you route there, the returned route will indeed snap the road. This because it is a short route, which can contain a lot of detail.

from react-native-maps-directions.

avinashclassy avatar avinashclassy commented on May 22, 2024

Add option for snap to road for better polyline support. I can help with this if needed.

i need your help,i am creating live tracking app using react native ,its done but polyline not travel throw road,please help me on it,how to use roads api key in react native

from react-native-maps-directions.

GabeConsalter avatar GabeConsalter commented on May 22, 2024

FYI: With version 1.7.3 you can pass a precision into react-native-maps-directions.

  • Setting it to "low" will draw the overview_polyline (which is an approximation of the route).
  • Setting it to "high" will draw a detailed polyline that should snap on the roads perfectly

Note that setting it to "high" will most likely cause a hit in rendering performance as many parts needs to be drawn …

Thank you!
This is awesome.

from react-native-maps-directions.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.