Introduction
The Google Maps API allows developers to integrate Google Maps into their applications. The APIs are used to display maps and enable users to see information about places, such as businesses and restaurants. You can use the API to build maps from scratch or build on top of other existing solutions like Bing Maps or Apple Maps.
Example:
<!DOCTYPE html>
<html>
<head>
<title>
Google Maps | Introduction
</title>
<!– Add Google map API source –>
<script src=
“https://maps.googleapis.com/maps/api/js“>
</script>
<script>
function INF() {
var CustomOp = {
center: new google. maps.LatLng(
28.502212, 77.405603),
zoom: 17,
mapTypeId: google. maps.MapTypeId.ROADMAP
};
// Map object
var map = new google.maps.Map(
document.getElementById(“DivID”),
CustomOp
);
}
</script>
</head>
<!– Function that executes when page load –>
<body onload=“INF()”>
<center>
<h1 style=” color:green”>
InfraveoTechnologies
</h1>
<h3>Google Maps</h3>
<!– Basic Container –>
<div id=“DivID”
style=“width:400px; height:300px;”>
</div>
</center>
</body>
</html>
Output:
GOOGLE MAPS –
INFRAVEO TECHNOLOGIES
Create a Google account or log in with an existing one –
1. You can create a Google account or log in with an existing one. To get started, you’ll need to add your credentials to a project –
- Create a project by clicking the “Create Project” button on the bottom right of your screen and entering some basic information about yourself (name, email address).
- Select which kind of project you’d like from the drop-down menu that appears after clicking “Create Project.” If this is your first-time using APIs for Maps, select “Web Resource”. This will create an empty directory structure for storing files in our cloud storage system called Drive. We recommend using Cloud Storage instead if possible because it has lower charges than other providers such as Dropbox or Google Drive; however, it works fine!
2. Go to google developer console –
Go to https://developers.google.com/maps/ and click on the blue button ‘Get started’.
A pop-up will appear asking you to sign in or create a new account if you have not already done so.
3. Select credentials under APIs & auth and create a new public API key –
- Go to the Google Developers Console.
- Click on APIs & Services, then click on Credentials.
- Select Create credentials and then choose API key.
- Click Next to create a new key or select an existing one if you already have one that works for your project(s).
4. Create a new project in developer console –
To create a new project in the developer console, navigate to https://console.developers.google.com/ and select the projects dropdown on the left side of your screen. Select Create New Project and give your project a name that will become visible to other users when they browse through their own list of projects, as well as being used as an identifier for this app that you’re building with Google Maps API.
5. Select your Project –
- Choose your project from the list of Projects displayed.
- Click on Create New Project. This will take you to a new page where you can choose an existing project or create a new one. If you are using this API for your website and have not created any projects yet, then select Create New Project and follow these steps:
If you have already created one or more projects and would like to continue with those instead of creating another one, click Cancel instead of Continue as shown below:
Now, you can select which APIs you want to use for your project. Ensure that the Google Maps JavaScript API v3 is turned on by selecting ENABLED under status as shown in the screenshot below. The Google Maps JavaScript API v3 allows developers to add maps and location services into their applications without having to worry about the complexity of building and maintaining an entire application from scratch.
6. Takeaway –
You should now have a new project in your developer console.
- Create credentials for your project: In the same window, select Credentials from the left-hand menu. In the “Project” section of this page, click Create credential and follow the instructions on screen to create a new key for your app (or website). Once you’ve created it, copy this key so that we can use it in later steps!
- Enable Google Maps JavaScript API v3: Make sure that “Google Maps JavaScript API v3” is selected under Project settings > Options > Advanced options > Set up map controls (this will allow us access to all features of Google Maps APIs).
Conclusion
That’s it! Now you can start using the API v3. You can create a project and sign up for the Google Maps SDK for PHP, which will allow you to integrate maps into your own applications. The next step is to get familiar with the documentation, so that when we talk about how to use this feature in future articles, you’ll already know what we mean by it!
