Google maps using php code

in PHP Code / 7 Comments

We can implement two types of mpas, one google maps and second one is yahoo maps.
one first one is google maps- we have to sign up for API key, with that API key we can place the maps.

The Google Maps API lets you embed Google Maps in your own web pages with JavaScript. The API provides a number of utilities for manipulating maps (just like on the http://maps.google.com web page) and adding content to the map through a variety of services, allowing you to create robust maps applications on your website.

We can signup for our website url at :

http://code.google.com/apis/maps/signup.html

In that fill the text box My web site URL: http://[Domain Name] . . . It will generate the one API Key.

with that API Key we can embed the google map to our website.

We can simple javascript to embed the maps to our website:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>GSmapSearchControl Sample</title>
<!– Note:
Make sure to replace the &key=internal with &key=~the value of your key~
in both the maps API script load and in the Ajax Search API script load statements
–>
<!– maps api, ajax search api, map search control code –>
<script    src="http://maps.google.com/maps?file=api&v=2&
key=ABQIAAAAGvs30FUboNhX-BMsz1wHmhRueXhM_ZR0uaVb2boWRzq1eE2kghQvVdJiR71BuD29Jsee_kDbmydTOQ"

type="text/javascript">
</script>
<script   src="http://www.google.com/uds/api?file=uds.js&    v=1.0&key=ABQIAAAAGvs30FUboNhX-BMsz1wHmhRueXhM_ZR0uaVb2boWRzq1eE2kghQvVdJiR71BuD29Jsee_kDbmydTOQ"
type="text/javascript">
</script>
<script src="http://www.google.com/uds/solutions/mapsearch/gsmapsearch.js"
type="text/javascript">
</script>
<!– ajax search stylesheet, map search stylesheet –>
<link href="http://www.google.com/uds/css/gsearch.css" rel="stylesheet"    type="text/css"/>
<link href="http://www.google.com/uds/solutions/mapsearch/gsmapsearch.css" rel="stylesheet"/>
<style>
body, table, p{
background-color: white;
font-family: Arial, sans-serif;
font-size: 13px;
}
#mapsearch {
width : 400px;
margin-left: 10px;
padding: 4px;
border : 1px solid #f9f9f9;
}
</style>
<script>
function LoadMapSearch() {
var options = {
title : "Googleplex",
url : "http://www.google.com/corporate/index.html"
}
new GSmapSearchControl(
document.getElementById("mapsearch"),
"1600 Amphitheatre Parkway, Mountain View, CA",
options
);
}
GSearch.setOnLoadCallback(LoadMapSearch);
</script>
</head>
<body>
<div id="mapsearch">Loading…</div>
</body>
</html>

With the above code we can implement the maps to our website.

Thank you,

Anil Kumar

With more than 8 years experience in PHP and Founder of Anil Labs, a blog for PHP and related posts. contributed posts regarding CodeIgniter, CakePHP and Learn PHP online ...Contact : [email protected]

Discussion 7 Comments

Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>