This is a continuation of
Export My Maps Into KML File
in which we had learned how to export
Google My Maps into KML file .
To integrate KML layer into our website we will be using
Google Maps javascript v3 API's google.maps.KmlLayer()
function . We pass the URL of the KML file as the parameter
to this function .
// The Kml Overlay should be used as var georssLayer=new google.maps.KmlLayer(url); // Since KML is an overlay you should // use the Google Map setmap property georssLayer.setMap(map); // map is the Google Map Object
The complete code for Google Map KML Layer is as follows .
<!DOCTYPE html>
<html>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps JavaScript API v3 Example: KmlLayer GeoRSS</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false">>/script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js">>/script>
<script type="text/javascript">
$(document).ready(function() {
initialize() ;
});
function initialize() {
var myLatlng = new google.maps.LatLng(49.496675,-102.65625);
var myOptions = {
zoom: 4,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var georssLayer = new google.maps.KmlLayer('http://www.google.com/maps/ms?ie=UTF8&hl=en&msa=0&msid=202891427095450912947.0004a29997cffdd0f176d&ll=19.156195,73.061829&spn=0.326906,0.672226&z=11&iwloc=0004a299a67007d319eb4&output=kml');
georssLayer.setMap(map);
}
</script>
<body>
<div id="map_canvas" style="width:500px;height:550px"></div>
</body>
</html>
Your Google Map Integrated into your Website should look like this .
1 comments :
Hi,Planning websites is pretty much like designing stage sets, it must look great, but under the surface for Web Design Cochin it has to work so that the search sites and web surfers can find your website.Thanks.............