Track your location with the JavaScript Geolocation API

Поделиться
HTML-код
  • Опубликовано: 16 мар 2020
  • Learn JavaScript 👉learnjavascript.online/?...
    React Tutorial 👉react-tutorial.app/?...
    Learn Programming 👉 learnprogramming.online/?utm_...
    Learn HTML CSS 👉 learnhtmlcss.online/?...
    Learn how to track your location with the JavaScript Geolocation API.
    We will build 2 mini apps, one that tracks your location and saves it to localstorage.
    The other one will draw the coordinates on a map!
    How to enable USB Debugging on your android: developer.android.com/studio/...
    Kenneth Rode ( / kennethrohde ) working on the Wake Lock API (web.dev/wakelock/)
  • НаукаНаука

Комментарии • 59

  • @JadJoubran
    @JadJoubran  4 года назад +2

    Learn JavaScript 👉 learnjavascript.online
    React Tutorial 👉 react-tutorial.app

  • @arjitmalik2981
    @arjitmalik2981 2 года назад

    Daamnnnn goood explanation !!!! you have something which I was searching for last few weeks. You diserves a subs man.

  • @stefanbogdanovic590
    @stefanbogdanovic590 4 года назад +2

    Man you are one of few developers that is doing something that nobody does geolocation speech synthetisis and moreee awesome. I am amazed. Cheers mate from Serbia 😁

    • @JadJoubran
      @JadJoubran  4 года назад +1

      awesome happy to hear that you like them :D stay tuned for the next one ;)

    • @stefanbogdanovic590
      @stefanbogdanovic590 4 года назад

      @@JadJoubran Can't wait 😁

  • @wesleymouedineassaby1035
    @wesleymouedineassaby1035 4 года назад +1

    Awesome, waiting your next video 😁

  • @drogueriarevilla6340
    @drogueriarevilla6340 2 года назад

    Wonderful tutorial. Thanks a lot from Panama.

  • @Anonymous-cb6by
    @Anonymous-cb6by 4 года назад

    Thank you so much Sir Best video finally knew how to work with watchPosition

  • @rthangam77
    @rthangam77 4 года назад +1

    Nice one thanks!

  • @sinsin7843
    @sinsin7843 2 года назад

    very clear, thank you from Taiwan ~

  • @Rick-sf2cz
    @Rick-sf2cz 4 года назад

    This was a really cool video! Nice job

  • @theuniverse685
    @theuniverse685 4 года назад +1

    Excellent video!!

    • @JadJoubran
      @JadJoubran  4 года назад

      😄😄😄 Stay tuned for the next one ;)

  • @computerscience1152
    @computerscience1152 3 года назад +1

    Awesome tutorial...

  • @NDREAN67
    @NDREAN67 4 года назад +2

    Nice video, thks for the surge tip. It seems that React Native can handle the gps in the background. Correct?

  • @_vinayk
    @_vinayk 3 года назад

    Hi Jad, thanks for sharing this. Was curious if you are aware of any work around for tracking geolocation in the background. Something that could track your running route without having the phone necessarily on all the time.

  • @bilelrahmouni01
    @bilelrahmouni01 2 года назад

    thank you!!

  • @vidumini23
    @vidumini23 4 года назад +2

    Hi Jad, Really appreciate your video.
    Can you do a video for,
    Tract react native mobile app gps location --> send data to firestore database --> Show in the react web app.
    That is a part of my final year project. I'm using node server. I'm bit stuck in there.
    I really appreciate if you can do a video or if you can give me some suggestions and recommendation example.
    Thank you..

  • @hadjermohabeddine7645
    @hadjermohabeddine7645 4 года назад

    hi, i'm building a project for a smart parking and i wanted to use watchPosition while the reservation is running to determinate if the user arrived or not at the end of the countdown so is it a problem if the countdown is about 20 minutes or maybe more?

  • @DanieleOrlando22
    @DanieleOrlando22 4 года назад +3

    Great tutorial and amazing video!

  • @niswarthvshetty3678
    @niswarthvshetty3678 4 года назад +1

    How you recorded the coordinate in your phone?

  • @DarellND
    @DarellND 3 года назад

    What's the use of the stop button?

  • @hirisraharjo
    @hirisraharjo 2 года назад

    Nice Video! But is it possible to do real time tracking like what uber/grab/gojek does?

  • @endlesswaltztoledo
    @endlesswaltztoledo 3 года назад

    what the stop button does?

  • @Siddharth-yi7pg
    @Siddharth-yi7pg 3 года назад

    how to draw path of live tracker on google maps in reactJS , please help any npm library or procedure

  • @mitko746
    @mitko746 Год назад

    How would you be able to update the map in order to draw it live as I am able to import the coordinates once, but it wouldn't update the map every time a new coordinate has been added to the array

  • @amjadali7691
    @amjadali7691 3 года назад

    Can you please do the same project using esp32. I do same. Get location information by using ip api. But it don't update the position location when I change my location.

  • @yaseenimuhammadraja9461
    @yaseenimuhammadraja9461 3 года назад

    Hai, good video,and also I want to get user's exact correct location without SSL in my website, how to do it

  • @afilnwier
    @afilnwier 2 года назад +1

    how you can get your coordinates on your phone?

  • @Master0fDisaster13
    @Master0fDisaster13 2 года назад +2

    How can I run this app on my phone to collect the data?

  • @mohammedkhadeeruddin6287
    @mohammedkhadeeruddin6287 Год назад

    What if we are using external gps tracking device which uses SIMCARD within it and want to connect it within our own Map in application...may do I know,how can we code for this.

  • @shyamvyas3327
    @shyamvyas3327 Год назад

    My coordinates were not very accurate and some locations were from the other side of the street, causing the map to create false circular routes. How to correct this.

  • @KorhalKk
    @KorhalKk 5 месяцев назад

    The code is nice, but this copying and pasting of coordinates seem to be a little counterproductive, shouldn't we automate it?

  • @tarik6040
    @tarik6040 4 года назад +1

    I do need opposit of this work, if anyone can help me, I need a way to hide my location, not VPN not tor not proxy all these did not work .... I m ready to pay 200 euro or even more ...

  • @shivayshakti6575
    @shivayshakti6575 Год назад

    ❤️

  • @prakasasiva2099
    @prakasasiva2099 3 года назад

    Hey bro,
    How do I do the same tracking but calculate the distance between the coordinates and display it, any sort of help would be appreciated.
    Thank you

    • @spb1179
      @spb1179 2 года назад +1

      You can use Pythagorean theorem to find the distance between each point, and then convert that many degrees to meters or miles, whatever your like. Then just sum them together

  • @abdallahaly498
    @abdallahaly498 4 года назад

    hey jad , i need to build similar project but real-time locator , could you tell me what do i need to do that or how ??

    • @maximussu7609
      @maximussu7609 4 года назад +1

      I know how to do that and i can guide you

    • @abdallahaly498
      @abdallahaly498 3 года назад

      @@maximussu7609 Ooh! really??
      then tell me how to cantact with you?

  • @justkeepfilming9767
    @justkeepfilming9767 4 года назад

    Hi! Is there any way I can track my realtime location (e.g when i go walking id like to track where i go and display it on a map) with just using HTTP? Thanks :)

    • @JadJoubran
      @JadJoubran  4 года назад

      only on localhost
      alternatively you can setup a self-signed SSL certificate

    • @justkeepfilming9767
      @justkeepfilming9767 4 года назад

      @@JadJoubran okay thanks a mil! :)

  • @hasithananayakkara7956
    @hasithananayakkara7956 3 года назад

    try with a real tracker and node

  • @georgejohnson6258
    @georgejohnson6258 3 года назад

    HI, how can I make a tracker whereby i can type in a phone number of a lost phone or my colleague's phone (with their permission and find their location.

  • @daria_itis
    @daria_itis 3 года назад

    Is it a real time application ?

    • @ConsulthinkProgrammer
      @ConsulthinkProgrammer 3 года назад

      Nice. I found that we even can use this method and send that latitude, longitude, and address data to google sheets.

  • @netboy1102
    @netboy1102 3 года назад

    I know your location, Amsterdam...

  • @RaymondovanDijk
    @RaymondovanDijk 3 года назад

    Amsterdam whoep whoep

  • @maximussu7609
    @maximussu7609 4 года назад

    Hi guys,you can try my complete demo on your updated location each time you move.
    jsfiddle.net/MaximusSu/9j04sgdx/23/?fbclid=IwAR289IdQP5AHX0-iZ7VZ9Gy75n72ypADAZ1ZBJE6Px_9di96g7RmZ-rm1pE
    Click on fullscreen to start.
    My biggest problem is this w3 school geolocation is not accurate sometimes and this piss me off. Is there a way to resolve this?

    • @maximussu7609
      @maximussu7609 4 года назад

      And Jad Joubran, I would like to know your email since we are quite close together in terms of age and maturity. Thank you

  • @HammerGruvin1
    @HammerGruvin1 Год назад

    Your content is good but your audio is lousy