Comparing Google Maps Using the Google Maps Embed API
Introduction
Previously, we had published an article comparing embedded maps using the Google Maps Embed API on this website. However, when the Google Maps Embed API was integrated into the Google Maps Platform, we mistakenly believed that what was once free had become a paid service, leading us to delete the article.
Upon further investigation, as of April 2, 2024, the Google Maps Embed API appears to be free and unlimited. Therefore, we will re-publish the previous article, aligning its content with the current Google Maps Embed API page to make map comparisons easier and the content simpler. Please note that we have omitted parameters for each map mode to simplify the article. For details on each map mode, please refer to the respective links.
The advantages of using the Google Maps Embed API for maps are its free and versatile usage, availability of several map modes, and the ability to create custom maps using parameters without the need for special programming. You can simply embed an iframe on your website, making it ideal for those looking to use creatively designed maps.
As a drawback, acquiring an API key may involve slightly tedious setup processes.
Note: We have added parameters for English display (&language=en) to display maps in English for the English page.
Map Modes
With the Google Maps Embed API, you can specify one of the following map modes:
place : Displays markers at specific locations or addresses, such as landmarks, shops or services, geographical features, or towns.view: Displays a map without markers or routes.directions: Displays the path between two or more specified points on the map, as well as the distance and travel time.streetview: Displays an interactive panoramic view from a specified location.search: Displays search results within the visible map region.Place Mode
Map of Okayama Station Using Place Mode:
This map specifies the place mode using place, and sets the marker’s position using q to Okayama Station in Okayama Prefecture okayama+station,okayama+prefecture.
<iframe src="https://www.google.com/maps/embed/v1/place?key=YOUR_API_KEY=okayama+station,okayama+prefecture&language=en" width="600" height="450" frameborder="0" style="border:0" referrerpolicy="no-referrer-when-downgrade" allowfullscreen> </iframe>
For details about the Place Mode parameters, please refer to the link below:
Place Mode Parameters
View Mode
Satellite Map of Okayama Station Using View Mode:
This map specifies the view mode using view, sets the center of the map to the latitude and longitude of Okayama Station at 34.666401,133.918637 using center, specifies the map type as satellite using satellite, and sets the zoom level of the map to 18 using zoom.
<iframe src="https://www.google.com/maps/embed/v1/view?key=YOUR_API_KEY¢er=34.666401,133.918637&zoom=18&maptype=satellite&language=en" width="600" height="450" frameborder="0" style="border:0" referrerpolicy="no-referrer-when-downgrade" allowfullscreen></iframe>
For details about the View Mode parameters, please refer to the link below:.
View Mode Parameters
Map of Okayama Station Using View Mode:
This map specifies the view mode using view, sets the center of the map to the latitude and longitude of Okayama Station at 34.666401,133.918637 using center, does not specify the map type, and sets the zoom level of the map to 18 using zoom.
<iframe src="https://www.google.com/maps/embed/v1/view?zoom=16¢er=34.666401,133.918637&key=YOUR_API_KEY&language=en" width="600" height="450" frameborder="0" style="border:0" referrerpolicy="no-referrer-when-downgrade" allowfullscreen></iframe>
Directions Mode
Route Map from Okayama Station to Onomichi Port (Hiroshima Prefecture) using Directions Mode (excluding toll roads and highways):
This map specifies the directions mode using directions, sets the origin to Okayama Station in Okayama Prefecture at okayama+station,okayama+prefecture using origin, sets the destination to Onomichi Port in Onomichi City, Hiroshima Prefecture at onomichi+port,hiroshima+prefecture using destination. It specifies the mode of travel as driving, excluding toll roads and highways using avoid with tolls|highways.
<iframe src="https://www.google.com/maps/embed/v1/directions?key=YOUR_API_KEY&origin=okayama+station,okayama+prefecture&destination=onomichi+port,hiroshima+prefecture&mode=driving&avoid=tolls|highways&language=en" width="600" height="450" frameborder="0" style="border:0" referrerpolicy="no-referrer-when-downgrade" allowfullscreen></iframe>
For details about the Directions Mode parameters, please refer to the link below:
Directions Mode Parameters
Route Map from Okayama Station to Kotohira-gu Shrine (Kagawa Prefecture) using Directions Mode (using public transportation):
This map specifies the directions mode using directions, sets the origin to Okayama Station in Okayama Prefecture at okayama+station,okayama+prefecture using origin, sets the destination to Kotohira-gu Shrine in Kagawa Prefecture at kotohira-gu,kagawa+prefecture using destination. It specifies the mode of travel as transit, using public transportation (trains and buses) using mode.
<iframe src="https://www.google.com/maps/embed/v1/directions?key=YOUR_API_KEY&origin=okayama+station,okayama+prefecture&destination=kotohira-gu,kagawa+prefecture&mode=transit&language=en" width="600" height="450" frameborder="0" style="border:0" referrerpolicy="no-referrer-when-downgrade" allowfullscreen></iframe>
Street View Mode
Map of Okayama Station Interior using Street View Mode:
This map specifies the street view mode using streetview, and sets the location to the latitude and longitude of Okayama Station at 34.666401,133.918637 using location.
<iframe src="https://www.google.com/maps/embed/v1/streetview?location=34.6664,133.9186&key=YOUR_API_KEY&language=en" referrerpolicy="no-referrer-when-downgrade" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
For details about the Street View Mode parameters, please refer to the link below:
Street View Mode Parameters
Search Mode
Map of Udon Restaurants in Kagawa Prefecture using Search Mode:
This map specifies the search mode using search, and sets the search keyword to udon restaurants in Kagawa Prefecture using q as udon+in+kagawa+prefecture.
<iframe src="https://www.google.com/maps/embed/v1/search?zoom=9&key=YOUR_API_KEY&q=udon+in+kagawa+prefecture&language=en" width="600" height="450" frameborder="0" style="border:0" referrerpolicy="no-referrer-when-downgrade" allowfullscreen></iframe>
For details about the Search Mode parameters, please refer to the link below:
Search Search Mode Parameters
Conclusion
We have compared five types of map modes using Google Maps Embed API. Whether for corporate websites, campaign sites, or personal blogs and websites, it is possible to easily and for free customize maps by adding or modifying parameters, without the need for special programs. If there is a map mode that suits your needs, we encourage you to give it a try.
About Us
We at AEDI are a web and graphic design company based in Kurashiki, Okayama, Japan. We offer services such as web design/development, WordPress development, multilingual site development, UI/UX design for apps, logo design, brochure design, catalog design, poster design, motion graphics and animation, character design for mascots, illustrations, and branding. We cater to clients in Kurashiki, Okayama, and nationwide, so feel free to contact us anytime.
