How to use Mapbox to convert from coordinates to address and back again

Back in January, I promised that a future post would cover how to go from a street address to latitude / longitude coordinates.  Previously, we have covered how to get the user’s street address, using navigator.geolocation and MapQuest and more recently, we covered converting addresses to latitude and longitude but that wasn’t an actual street …

Continue reading "How to use Mapbox to convert from coordinates to address and back again"

How to autofill an address using mapbox

I have been poking at the Milwaukee County Trasit System (MCTS) APIs over the past few weeks.  A few years ago, I tried to write a bus app using Angular and it just didn’t work out well.  I figured that I would try it again, using what I have learned since then.  The first step …

Continue reading "How to autofill an address using mapbox"

Where art thou: Converting addresses to latitude and longitude.

Previously, we have covered how to identify where the user is, based upon navigator.geolocation and based upon their IP address (there are definitely ways to make IP-based geolocation suck less).  I figured that in today’s post, we would look at how to go from an arbitrary physical location (zip code or city name) to latitude …

Continue reading "Where art thou: Converting addresses to latitude and longitude."

State Parks App: Let’s add Bulma and Sorting

Last week, we finally got the park listing working and updated the instance at test.wisparks.jws.app.  This week, I figured that we should add Bulma to the project and add sorting. So, let’s start by adding Bulma and cleaning the code up a little. See the Pen Wisc Parks (Part 5): Cleaning up the listing and …

Continue reading "State Parks App: Let’s add Bulma and Sorting"

State Parks App: Let’s try that again?

Last week, I got all the way to the end before the damn Google Sheets API stopped working on me.  This week, I figured that we would create a JSON file out of the spreadsheet, host it somewhere, and then just use that.  I started by creating a CSV file from the Google Sheets document, …

Continue reading "State Parks App: Let’s try that again?"

State Parks App: Let’s actually build something

Previously, we built an API for the State Parks App, using Google Sheets and we set up hosting for the thing.  The next step is to actually write the first bit of the thing.  When we created the API, we also wrote a little vue.js proof of concept that loops over the data and outputs …

Continue reading "State Parks App: Let’s actually build something"

Playing with the OpenWeather API: The basics

Ever since Apple bought and shut down Dark Sky, I have been struggling to figure out what to replace it with.  I figured that this would be a good excuse to play with some weather APIs.  I have done this once before but that was with Rivets and YQL (neither of which I can necessarily …

Continue reading "Playing with the OpenWeather API: The basics"

How to get the user’s street address, using navigator.geolocation and MapQuest

Let’s say that you have a webform where you are collecting a user’s street address.  You can save the user a few minutes by defaulting the value for them.  In this example, we are using Vue.js, Axios, a MapQuest API, and navigator.geolocation to first get the latitude and longitude from the client and then send it off to MapQuest to get a physical address.

See the Pen
HTML5 Geolocation (how to get a street address)
by Joe Steinbring (@steinbring)
on CodePen.

This example builds off of our earlier Axios / Vue.js 2 APIs 101 post. But you will notice that there is a methods property, now. The this.geolocation() function is then kicked off within mounted().

Have a question or comment? Drop it in the comments and I will try to help.