Playing with Google Map API

May 27, 2013 in RESEARCH
1 min read

The main purpose of this post is only to write about Google Map API for future reference. Here are the code snippets :

Get the latitude and longitude based on address : http://maps.googleapis.com/maps/api/geocode/json?address=435A%20Kent%20St&sensor=true

The code below set up the Google Map, put the marker and also make it grayscale

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32


function initialize() {
    var map;
    var location = new google.maps.LatLng(-33.87190930, 151.20480740);
    var styles = [
        {
            featureType: "all",
            elementType: "all",
            stylers: [
                { saturation: -100 }
            ]
        }
    ];

    var mapOptions = {
        center: location,
        zoom: 17,
        mapTypeControlOptions: {
            mapTypeId: [google.maps.MapTypeId.ROADMAP, 'theGray']
        }
    };

    map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);
    var mapType = new google.maps.StyledMapType(styles, { name:"GrayScale" });    
    map.mapTypes.set('theGray', mapType);
    map.setMapTypeId('theGray');

    marker = new google.maps.Marker({
        position: location,
        map: map
    });
}
google.maps.event.addDomListener(window, 'load', initialize);