Ionic Google Maps part 2 - turn by turn navigation
Vložit
- čas přidán 8. 09. 2024
- Part 2 of 3 video tutorial series, we look at how to integrate Google Maps Turn-by-turn navigation.
We continue where we left off from part 1. If you haven't watched part 1, you can do so here: • Ionic 5 Google Maps: G...
In part 1, we integrated Google Maps and created custom markers with custom info windows. In part 2, we add a 'navigate' button that when tapped it opens up the Google Maps app or if no Google Maps app is installed on the device or if the app is running in the browser, it will instead open the google maps web app in a browser window and hand over navigation to Google Maps. Google Maps will then take over and plot directions from the users' current location, to the location indicated by the marker whose 'navigate' button was clicked on. In a future tutorial, we will explore how to implement the navigation functionality within the Ionic app without handing over to Google Maps.
Download Code here: www.codeswag.c...
Make sure you hit the red subscribe button and click the bell icon so that CZcams notifies you when new tutorials are uploaded. Also, remember to like & share this video.
Please support this channel by buying some awesome tech gadgets for yourself or a loved one from our online store at www.codeswag.co.uk/shop
Would be nice to see a basic clone of Uber. Something like a moving car marker from point A to point B
Thanks for the idea Robert! I'll definitely do that soon. Please subscribe so you can get notified when it's uploaded.
@@CodeSwag thanks. Subbed ✌️
@Code Swag Very informative videos...Yes it would be great if you show uber clone..Would be waiting for it 🙂
Kinda late to the party. That kind of app would violate Google Terms of Service, so it's a big nono
@@blackopraidenand what is the solution?
I was looking for that code. You're the best Thanks a lot!
I'm glad i could help. Please help me out by liking, subscribing and clicking the bell icon so you get notified of new videos.
Thanks alot for this tutorial. For me it would be great if you could do a video about navigation in the app without jumping into google maps
Sure thing! I'll be publishing a tutorial for that soon. Please do subscribe and click the bell icon to get notified when that video is uploaded 🙂
thank you! Been looking for this for a long time!
Thanks you very much really appreciate this talent
Thank you so much.. it works perfectly in mobile app..
You're welcome! Please so subscribe
ooowwsssmmm buddy 100% perfect thank you soo much
Awesome! Thank u for your help :)
404. That’s an error.
The requested URL /maps/dir was not found on this server. That’s all we know.
/*GOT THIS ERROR*/
any solution
Happy to help!
Hi, I got this error. Can you help me please?
404. That’s an error.
The requested URL /maps/dir was not found on this server.
trying to find the link to the tutorial for the the in-app navigation implementation
While building this i seen that app getting closed after display time we set. Is there any solution to make the screen always on while map is on?
not working pls help me ?? I click on navigation nothing happen nor console log generated?
Check the capitalization you are using on the InfoWindows functions. That's usually the cause of that issue
Hi can you help me, show image on info window using downloaded picture on assets?
The requested URL /maps/dir was not found on this server. That’s all we know.
Could you continue this tutorial? If you could add an address finder like uber
Yes I am creating continuations of this tutorial. Please like & subscribe so that you can get a notification when a new tutorial is published.
The mentioned google maps url doesn't work (anymore) ? Is there another way to integrate google maps navigation
@code swag
(1) If we use ionic storage..
So will be store data on ( web browsers, android,ios ) on localstorage ?
(2) if we use ionic SQLite,
So will it create database on all three ( web browsers,android or ios) ?
If all three ,then good..
If it doesn't create database on browsers, so what to do in that case?
Nice tutorial. Can you make an example of how to clustering markers?
Glad you liked it Mario :) . Please explain what you mean by clustering markers.
@@CodeSwag Yeah, it´s used when you got too many markers on a map and need to combine markers that are closed to each other into clusters and show the total amount of markers in the cluster. Here is the link at google maps api about marker clustering. developers.google.com/maps/documentation/javascript/marker-clustering
I was searching around and I already got it working. Thanks anyway your tutorial was really helpful.
Please share code for google map autocomplete
codeswag.net/how-to-add-google-maps-to-your-ionic-app/
@@CodeSwag thanks
Can we do with help of googlemaps/js-api-loader in ionic 6?
hi, can i have the current link to navigate?
404. That’s an error.
The requested URL /maps/dir was not found on this server. That’s all we know.
/*GOT THIS ERROR*/
si il vous plait le code source
I have error.
When I click button open in browser and comes 404 error
How fixed it?
please contact me on email and I'll help you debug shop@codeswag.co.uk
@@himamendis1169 same problem can you find any solution ?
still waiting for integrate in app navigation
Hi Mtobisi. I'm working on it, been dealing with some personal issues the last couple of months.
error is showing when i open it in the browser please reply
what is the error? Please email the screenshot shop@codeswag.co.uk