GMgKe586q6suSQnyqZLlGCooeWM

Pages

Search

Saturday, March 12, 2011

Google - Map API

Here's a simple example for Google Maps generation as png file:
http://maps.google.com/maps/api/staticmap?center=Berkeley,CA&zoom=14&size=400x400&sensor=false
The basic url is: http://maps.google.com/maps/api/staticmap?parameters

The parameters explained:
1. center - the place you search. if there's a spaci, fill it with plus sign.
    like for new york -> new+york
2. zoom - zoom level
3. size - width x height
4. sensor - false or true
5. maptype - roadmap, terrain, satellite and hibrid







/**
 * Here's an example on how to use it using javascript
 */

<h1>Google Maps API</h1>
<img src="" id="img"/>

<script>
function renderMap(data, el){
 var center = data.center;
 var zoom = data.zoom;
 var width = data.width;
 var height = data.height;
 var sensor = false;

 var url = "http://maps.google.com/maps/api/staticmap?center="+ center +"&zoom="+ zoom +"&size="+ width +"x"+ height +"&sensor="+sensor;
 el.setAttribute('src',url);                
}

var data = {};
 data.center = "Jakarta";
 data.zoom = 15;
 data.width = 200;
 data.height = 200;

var img = document.getElementsByTagName('img')[0];
renderMap(data,img);

</script>
Share/Bookmark

1 comment:

  1. thanks a lot pal, very useful for newbie like me :)

    ReplyDelete