Rather than setting a location manually, web browsers provide a way that we can request access to someone's location. This lets us personalize features and particularly in our use case, find where the person is on the map to see what's close to them.
Colby Fayock: [0:00] To add a new button, we're going to first copy the one that we had before and add it right below. Instead of the "Set location" statement, we're going to say, "Find my location." Inside of this handle function, we're going to create a new one called handleOnFindLocation.
[0:11] The first thing we need to do is actually define that function. We're going to say, "Function handleOnFindLocation." Because we're going to use our map again, we can copy and paste that block from above where we de-structure our map. Now that we have our map, we're going to make use of its geolocation features.
[0:24] We're going to set our map, and we're going to tell it to locate. Now, when we reload the page, we can see our "find my location" button. When we click it, we can see that the browser is asking for our location.
[0:32] If we click Allow, we can see that it's actually not doing anything. When using the locate feature, it doesn't do anything except find the location. We can pass in an options object where we can specify setView(true). Now, next time we click "find my location" and we allow it, it finds our location.
Member comments are a way for members to communicate, interact, and ask questions about a lesson.
The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io
Be on-Topic
Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.
Avoid meta-discussion
Code Problems?
Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context
Details and Context
Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!