Posted:


Editor’s note: Today’s guest blogger is Robert Maretsky, Director of Mobile for GolfNowGolf Channel. Read how the GolfNow app uses Google Maps APIs to help golfers find the right course and improve their scores.

It can be easier for golfers to get a hole in one than to find the right golf course. That’s what led us to create the GolfNow app (available for Android), which helps golfers find and make reservations at courses, and improve their games by showing satellite views of courses as they play. The app is a spinoff of our GolfNow website. The app shows golfers their exact location on the course and the distance between their location and the cup by collecting routing information from a third party and overlaying it on top of Google Maps Satellite view.
We chose the Google Maps APIs because of the comprehensive coverage, timely updates and easy integration with our Android app. We use Google Maps to provide course details so that golfers can find the course that’s right for them. When on the course, to help golfers decide how to best play their next shot, we use the APIs to display satellite images from Google Maps and use a phone’s GPS to show golfers where they are on the course.
The Places API has been particularly useful for helping people search for golf courses based on location. If you know you’re going to have free time when visiting (for example) Universal Studios in Orlando, you can type 'Universal Studios' in the search bar and discover nearby courses. Results display course information, including reviews and star ratings from GolfAdvisor.com. We use custom layouts in our infowindows to style and display the data from the Places API.
GolfNow website is the largest provider of tee times in the world, with more than 13 million rounds and counting. Now, thanks to apps powered by Google Maps APIs, we’re making it even easier for golfers to get the most out of their favorite sport — helping them find and book tee times, playing golf with accurate GPS information, and reviewing how they did after the round is complete.

Posted:


Editor’s note: Today’s guest blogger is Tom Edwards from the marketing and promotions agency The Marketing Arm. Read how The Marketing Arm used Google Maps APIs to build a website for GameStop to promote the launch of a new game.

If you’re going on a monster hunt, it’s a good idea to bring a map. And if you want to build buzz around the release of a new game, you should have the right tool as well—in our case it was Google Maps APIs. We built a website for GameStop to promote the launch of The Witcher 3: Wild Hunt, an action role-playing game from Warner Brothers and CD Projekt RED. After a visitor logs into the promotional website she is dropped into a map of the world and collects clues about where to find monsters. The goal is to be the first person to find each monster and win a prize.

The game’s launch deadline required us to build the site within a tight timeframe. We chose Google Maps APIs because they provided the tools we needed to build our maps quickly and easily. They also let us focus on the site creative rather than get bogged down with technical issues. We use the Google Maps JavaScript API for the front end, to start the experience and immerse visitors into the virtual world. Then, with the Google Maps Street View Service we allow users to search for monsters. We took images of the monsters and used overlays to drop them into familiar surroundings.

We use the Street View API to plant the user in a random location somewhere in the world, then visualize their surroundings, including monsters and trails of blood. We set a randomly generated starting point to the map based on five predefined locations. From there we have event listeners in place for 'mapView: bounds_changed, streetView: visible_changed, streetView: position_changed, streetView: pov_changed, searchBox: places_changed'.

When the user has initialized Street View, we make a call to our API to see if any monsters are within a defined distance from the LatLng of our monster data set. We continue this test anytime the position_changed event is fired until a monster is within range. At that point we update the class of a div that sits above the map view. Each monster is assigned a specific css class which allows us to easily make tweaks.

Google Maps made it easy to combine the real world of Street View with imaginary creatures from the game. Our goal went beyond just our users having fun — we wanted to build a site that would create genuine excitement around the game and give people a taste of monster hunting in the real world.

Posted:

We’re hitting the road—hosting a series of developer meetups in Boulder, Chicago and New York. As a way to bring the excitement of Google I/O to our developer community, we’re visiting select cities across the U.S. to share how developers can use the Google Maps APIs in their apps and websites.

The meetups will feature sessions with Google Engineers as well as customers such as Lyft, iFit by Icon Fitness, and more. Request a seat for our meetup in a city near you. Space is limited, so we encourage you to sign-up in advance. Once space is sold out, we’ll place additional requests on our waiting list.

June 4th - Boulder, CO
June 9th - Chicago, IL
June 18th - New York, NY

We hope to see you on the road.

Posted by Ashley Smith, Developer Marketing, Google Maps APIs

Posted:
The Google Geocoding API now returns Place IDs in the response and can also be queried with Place IDs. Place IDs identify a unique place in the Google Places database and on Google Maps and can be used to ensure that multiple APIs are referencing the same place. Now developers can use Place IDs across the Google Maps Roads API, Geocoding API, the Places library in the Google Maps Javascript API, and the Google Places API.

Traditionally, developers reference locations on a map as latitudinal and longitudinal coordinates. However, different APIs can translate the same latlng to different addresses, and the translation from latlngs to addresses can also change over time. Place IDs provide a way to consistently reference the same location across multiple APIs. By using Place IDs in your app, the locations you reference become more consistent and apps become more reliable and user-friendly.

For example, when using latlngs to reference locations, the Google Maps Roads API only ever returns drivable roads, whereas the Google Geocoding API prefers to return the addresses of buildings. If your app used the Roads API to snap to a road, and then queried Geocoding API with a latlng to get the road name, the Geocoding API may have returned a neighboring road depending on the nearest building. With this launch, you can now query Geocoding API with the Place ID of the road returned by Roads API, ensuring that you’re getting the name of the correct road.

We’ve started adding support for Place IDs across the Google Maps APIs in order to standardize the way locations are handled between APIs. To learn more about using Place IDs, take a look at our documentation to learn how to retrieve a place using the place ID, handle multiple place IDs, and more.

Posted by Elena Kelareva, Product Manager, Google Maps APIs

Posted:


Editor’s note: Today’s guest blogger is Paul Kogan, CEO of Hovee. Read how Hovee is using Google Maps APIs to transform commuting by matching drivers with one another.

At Hovee, we are reinventing the carpool by combining it with the power of social networking. We’ve built our company around the concept of “social commuting” — the idea that more people will carpool if they can choose who shares their drives based on routes and personal interests.

Our platform matches commuters with each other to find the most efficient carpools for everyone. We use Google Maps APIs to calculate and plot routes and drop-off points, displaying them in our web and iOS apps. Since about 70 percent of our user base is iPhone users, we decided to focus on delivering the iOS app first. We plan to add the Hovee Android app this summer.

After users download the app, they create personal profiles which we use to match people based on compatibility, for example, whether they prefer to listen to the radio or chat during their commute. Users enter their home and work locations, and we use the Geocoding API to validate addresses. The Geocoding API has been hugely effective and is more accurate than our previous mapping service, Apple Maps. We switched to Google Maps for more accurate geo-coordinates and the ease of getting waypoints and plotting polylines.
Hovee_Commute_Details.png

Once profiles are complete, we generate a RideMatch list for each user. It shows their optimum commuting partners, sorted by an algorithmic score which combines route calculations, schedule and social components. To enable this feature, two Google Maps APIs come into play: the Directions API and the Distance Matrix API. The Directions API identifies the routes while the Distance Matrix API estimates driving time and distance. We then plot pickup and drop-off points using the Javascript API for the web client, and the Google Maps SDK for iOS for the iOS app.
Hovee_RideMatch.png Hovee_iOS_Map.png

When commuters browse the profiles of possible ride partners, we obscure their home and work addresses for privacy reasons.

We now have several hundred people from a dozen companies in the San Francisco Bay Area participating in our pilot program. We’re currently working to bring Hovee to all Bay Area commuters. This summer we plan to expand the service to the Washington D.C metro area.

Setting up carpools can be a complex interaction. But with the power of the Google Maps APIs, our users can now do this in a way that’s responsive, intuitive and social.

Posted:


Editor’s note: Today’s guest blogger is Robert James Reese, executive producer for Runner's World Online. Read how Runner’s World’s 40 Million Steps website used Google Maps APIs to build a virtual tour of an around-the-world run.

The journey of one runner's trek around the globe is an amazing feat, and at Runner’s World we wanted people to share in the experience. To do this, we created the 40 Million Steps website, which allows people to relive Tom Denniss’ record-breaking, 622-day, world-spanning run.

The site uses Google Maps APIs to allow people to relive Denniss’ 16,300-mile run. Using Satellite View, users can click on the map to see the thousands of photos and nearly 400 videos captured during Denniss’ journey, making it feel as if they were there.

Our online launch coincided with a feature we ran in our April 2015 print issue, so we wanted the online version to have some of the same look and feel to create a cohesive connection between print and online. The styling for the map itself is all specified through the styles property of the MapOptions object in our JavaScript.
RunnersWorldScreenshot.png
Users view Day 1 of the run and are able to click through his progress.

We used the Geocoding API and the Elevation API as editorial tools. The Geocoding API helped us to fact-check location names, and we used the Elevation API to find out and highlight interesting facts about the run, such as its lowest and highest points.

The Javascript API was key in building the site. We faced a real challenge because of the amount of data we had from the run, on which Denniss wore a GPS-enabled watch to record his locations. Typically, when creating a polyline with the Google Maps API, we would have just included a "new google.maps.LatLng" on a separate line for each point, as shown in the documentation on Google’s developer site. However, since we were dealing with over 3 million GPS data points, it was too many for the browser to handle, so we simplified the polyline before sending the points to the browser by sampling every 20th data point.

We set out to build the site to impress our audience and give them something really cool that they hadn’t seen before. There’s arguably no better way to experience the joy, pain, exhaustion and exhilaration that Denniss felt during his run around the world—and Google Maps APIs were key to bringing his adventure to life.

Posted:

Editor’s note: ‘Map Tips’ are designed to answer frequently asked questions about Google Maps APIs. For important tips on how to deploy Google’s mapping tools, read more from David McClusky, Google Maps Solutions Architect at Google.

One of the most familiar features of Google Maps is autocomplete, Google’s ‘type ahead’ functionality. Autocomplete reduces errors in entries and provides a better search experience for the user. This functionality is included in both our web and mobile Google Places API libraries, however many developers tend to overlook it when building their own mapping applications.
You can greatly enhance your application’s user experience by providing Autocomplete functionality for both address input, points of interest, and search terms. The Google Places Autocomplete API is available in the Places Javascript API, as a web service, in the Places API for Android, and coming soon in the Places API for iOS.

Here are some easy steps to help you get started with Autocomplete on your website, using the Javascript version of the Places API.

Step 1 - You need to specifically include the Places library when loading the Google Maps Javascript API. To do this, you will need to load the Google Places library using the libraries parameter in the bootstrap URL for the Google Maps JavaScript API. Be sure to replace API_KEY in the example with your Maps API key.

<script type="text/javascript"
src="https://maps.googleapis.com/maps/api/js?libraries=places&key=API_KEY">
</script>

Step 2 - Create a text box on your page for the user’s input. After you have a text box, you start the autocomplete service and attach it to that text box. You can set a variety of options, such as restricting the results to cities only, as in this example.

HTML:
<input id="search" type="text">

JavaScript:
var autoComplete = new google.maps.places.Autocomplete(   
document.getElementById(search), {
  types: ['(cities)']
});
Step 3 - Add an event listener to the text box that fires when a result is selected. You can then handle the results. In this example, we pan and zoom the map to the location entered by the user.

JavaScript:
google.maps.event.addListener(autoComplete, 'place_changed', function() {
  var place = autocomplete.getPlace();
  if (place.geometry) {
     map.panTo(place.geometry.location);
     map.setZoom(15);
  } 
});
That’s all there is to it.

Tips for Improving the Autocomplete Experience
There are many additional features to make Autocomplete an even better experience on your website. Here are some tips to make the most out of autocomplete:

  • Improve the experience by biasing the results to a particular geographic area, such as the map viewport, or restricting the search to a particular country. This will insure that the results most relevant to your users are surfaced first.
  • You can style the autocomplete results by defining your own custom styles, to match the look and theme of your website. View the styling documentation here.
  • Combine with other Places API features, such as Nearby Search, to provide an all-in-one local search experience, complete with nearby point of interest listings and business photos.
  • Need to call Autocomplete from a server? Use the Google Places Autocomplete web service.
  • Want to autocomplete on search terms, rather than just place names? Use the Query Autocomplete web service or Javascript SearchBox.

Building a mobile app?
The Google Places API for Android can provide a great Autocomplete experience for address entry in your mobile application. Take a look at the developer documentation as well as a complete sample application on GitHub.

Get Started
We hope you’re able to incorporate the Autocomplete capabilities into your website or mobile application. Get started with Autocomplete today by visiting the following resources:


Posted by David McClusky, Google Maps Solutions Architect