Discover local bike shops with Bike Shop Mapper. This web page puts nearby bike shops on a full-page map. There are three ways to pick a location: by allowing the program to get your mobile device’s current location, by entering the name of a place (or ZIP code) into the “Places Autocomplete” input, or by panning the map and pressing “find bike shops.”

The data comes from Google’s list of places with “bicycle store” entered as a category. They have bike shops all over the world, but only if the shop has a page on Google+.

The bike icons will be light green if the shop is currently open, dark green if closed, and medium green if unknown.

If your favorite bike shop doesn’t appear, it can be added via Places for Business at no charge. This should be done by someone with access to the company phone so they can verify the content. See Google’s Getting Started page for help.

Last year I made a similar map for bike shops in Washington, DC and neighboring Arlington, Virginia. The data for the Bike Shops and Beyond map was curated manually; I entered every business. The benefit of this method is that the results tend to be high quality, because I know the region. But the disadvantage is twofold: the map slowly grows out of date, and the scope is limited to a small region. See Updating the Bike Shops Map for more about this old map.

To make a more-dynamic map, I created the Yelp Mapper, which got its data from Yelp’s API (see Mashup of Yelp and Google Maps). You can search for “bike” and get a good set of results.

I chose to use the Google Places API because I can avoid a text search and instead use the precise category “bicycle_store”, one of the Supported Place Types.

Behind the scenes, the JavaScript code works almost the same as my previous map, the Market Mapper application (see Mapping America’s Farmers Markets). The USDA API was replaced with the Places Library of the Google Maps JavaScript API V3 (not the Google Places API). The PlacesService class has a nearbySearch method which accepts a bounding box (the map’s viewport) and returns a list of results. The list includes each place’s coordinates, but to get further details like the phone number and web site (shown in the infowindow) I need to call the getDetails method for each place. However, there is a query limit of the number of calls I can make in a second; during testing, I discovered most calls would have an error code returned. The list usually includes up to 20 places. By delaying the getDetails call I can stay within the limit. To implement this, the call is made when you click on a marker to get the infowindow. You might notice the infowindow’s text being appended after you click it. To avoid the “bump” of additional text, I also use setTimeout to preemptively get details, by spacing out the calls to one every half-second.

Take the Bike Shop Mapper out for a spin and see what you discover.

Finding Nearby Bike Shops

Leave a Reply