Google Maps API have been in tech world since quite a long period. Recently I had a chance to try my hands on Google Maps API. If you like JavaScript believe me you will gonna love Google Maps API. Thousand of APIs are available to paint a lot of things on Google Map. You can describe a wind range of data using Google Maps API.
Generate key for your website.
In order to use Google Map API, first you need to generate an API key that you will use to include google maps javacript in your web page. To generate API, goto http://code.google.com/apis/maps/signup.htmlDisplaying a Simple Map.
To paint a simple map showing a particular location use following code.<script src="//maps.google.com/maps?file=api&amp;amp;amp;v=2&amp;amp;amp;sensor=false&amp;amp;amp;key=ABQIAAAAzr2EBOXUKnm_jVnk0OJI7xSosDVG8KKPE1-m51RBrvYughuyMxQ-i1QfUnH94QxWIa6N4U6MouMmBA"
type="text/javascript"></script>
<script type="text/javascript">
function initialize() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(37.4419, -122.1419), 13);
}
}
</script>
</head>
<body onload="initialize()" onunload="GUnload()">
<div id="map_canvas" style="width: 500px; height: 300px"></div>
</body>
Code language: HTML, XML (xml)
Online Demo
Click here.Display an Infobox in your map.
To display an infobox, modify your initialize() method and add following code in it.function initialize() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(37.4419, -122.1419), 13);
map.openInfoWindow(map.getCenter(),
document.createTextNode("Hello, world"));
}
}
Code language: JavaScript (javascript)
Online Demo
Click here.Latitude/Longitude tracing demo.
I have created a simple demo that display latitude/longitude of any place where you click on google map.function initialize() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.setCenter(new GLatLng(18.4419, 73.1419), 8);
map.addControl(new GLargeMapControl());
map.addControl(new GScaleControl());
GEvent.addListener(map, "click", function(marker, point) {
if (marker) {
} else {
var marker = new GMarker(point);
map.addOverlay(marker);
var lat = point.y;
var lng = point.x;
marker.openInfoWindowHtml("Latitude:"+lat+"<br/>Longitude:"+lng);
}
});
}
}
Code language: JavaScript (javascript)
in Latitude/Longitude tracing demo
change getElementById(“map”) to (document.getElementById(“map_canvas”));
Nice posting.
I do customization and used my application.
I like to know, is there any way to find the location by zip code using geocode api
Hi,
Can any one tell me how can i integrate java with google api.
are there any references for this problem.
hi guys,
I need a tutorial for this kind of application:
– an app that gets my location and shows it with a marker on Google map.
– this app should have a button and when I click on it:
It select from my database nearest restaurants (within any range, maybe 1 miles) and show them with markers on the map.
=>of course restaurants are stored in the database with their names and coordinates (latitude & longitude).
If anyone ever seen any tutorial to do such an app, please tell me.
Thx