RetroSearch Browse

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://developers.google.com/maps/documentation/embed/map-generator below:

The Maps Embed API quickstart

Skip to main content The Maps Embed API quickstart

Stay organized with collections Save and categorize content based on your preferences.

Place an interactive map, or Street View panorama on your web page with a simple HTTP request—no JavaScript required.

Costs

All Maps Embed API requests are available at no charge with unlimited usage. However, all requests still require a valid Google Cloud API key. For more information, see Usage and Billing.

Before you begin

To create an embedded map on your web page, complete the required setup steps by clicking through the following tabs:

Step 1 Console

In the Google Cloud console, on the project selector page, click Create Project to begin creating a new Cloud project.

Go to the project selector page
Make sure that billing is enabled for your Cloud project. Confirm that billing is enabled for your project.
Note: While you must set up a billing account to set up a Cloud project, actual usage of the Embed API is available at no charge.
Google Cloud offers a $0.00 charge trial. The trial expires at either end of 90 days or after the account has accrued $300 worth of charges, whichever comes first. Cancel anytime. For more information, see Billing account credits and Billing.

Cloud SDK

gcloud projects create "PROJECT"

Read more about the Google Cloud SDK , Cloud SDK installation , and the following commands:

gcloud projects create

Note: If you don't plan to keep the resources that you create in a learning exercise, create a project instead of selecting an existing project. After you finish the exercise, you can delete the project, removing all resources associated with the project. Step 2

To use Google Maps Platform, you must enable the APIs or SDKs you plan to use with your project.

Console

Enable the Maps Embed API

Cloud SDK

gcloud services enable \
    --project "PROJECT" \
    "maps-embed-backend.googleapis.com"

Read more about the Google Cloud SDK , Cloud SDK installation , and the following commands:

Step 3

This step only goes through the API Key creation process. If you use your API Key in production, we strongly recommend that you restrict your API key. You can find more information in the product-specific Using API Keys page.

The API key is a unique identifier that authenticates requests associated with your project for usage and billing purposes. You must have at least one API key associated with your project.

To create an API key:

Console

Go to the Google Maps Platform > Credentials page.

Go to the Credentials page
On the Credentials page, click Create credentials > API key.
The API key created dialog displays your newly created API key.
Click Close.
The new API key is listed on the Credentials page under API keys.
(Remember to restrict the API key before using it in production.)

Cloud SDK

gcloud services api-keys create \
    --project "PROJECT" \
    --display-name "DISPLAY_NAME"

Read more about the Google Cloud SDK , Cloud SDK installation , and the following commands:

gcloud services api-keys create

Generating an iframe

Click through the following options and add a location and API key to generate an iframe for your webpage. For additional parameters and options, see Embedding a map.

Testing your iframe

To see your iframe in an HTML browser window:

Open your default text editor. You should have text editors such as TextEdit or Microsoft Windows Notepad installed on your device by default.
Create an HTML file and name it index.html.

Add the following code with the iframe you generated above:

<html>
  <!-- Replace this code comment with your iframe. -->
</html>

Save your index.html HTML file.
Load the HTML file in a web browser by dragging it from your desktop onto your browser; alternatively, double-clicking the file works on most operating systems.

Congratulations! You just set up and built a map using the Maps Embed API.

Cleaning up

You can delete your Google Cloud project to stop billing for all the resources used within that project.

Caution: Deleting a project has the following effects:

Everything in the project is deleted. If you used an existing project for this tutorial, when you delete it, you also delete any other work you've done in the project.
Custom project IDs are lost. When you created this project, you may have created a custom project ID that you want to use in the future. To preserve the URLs that use the project ID, such as an appspot.com URL, delete selected resources inside the project instead of deleting the whole project.

In the Google Cloud console, go to the Manage resources page:
Go to the Manage resources page
If the project that you plan to delete is attached to an organization, select and expand the organization list at the top of the page.
In the project list, select the project that you want to delete and click Delete.
In the dialog, type the project ID and click Shut down to delete the project.

Next steps

Start developing with the Maps Embed API by setting up your Google Cloud project:

Set up in Cloud console
For a list of additional parameters and options you can add in your iframe:

Embedding a map
Extend your Maps project with the Javascript API:

Maps Javascript API

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies. Java is a registered trademark of Oracle and/or its affiliates.

Last updated 2025-08-14 UTC.

[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2025-08-14 UTC."],[[["Embed interactive Google Maps or Street View panoramas on your webpage with simple HTTP requests, without needing JavaScript."],["The Maps Embed API is free to use with unlimited requests, but requires a valid Google Cloud API key and a billing account (though no charges will be incurred for typical usage)."],["To get started, you'll need to enable the Maps Embed API, create an API key within your Google Cloud project, and generate an iframe with your desired location and key."],["You can test the embedded map by creating a simple HTML file containing the generated iframe and opening it in a web browser."]]],["To embed an interactive map or Street View on a webpage, you'll need a Google Cloud project and a valid API key. First, create a project in the Google Cloud console, ensuring billing is enabled, although the Maps Embed API usage is free. Next, enable the Maps Embed API for your project. Then, generate an API key via the Credentials page. Lastly, use the provided options to create an iframe, including a location and the API key. Copy and paste this into an html file to preview your map.\n"]]

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4