cliveportman/code

Styling Google Maps

<script>
    var position = new google.maps.LatLng(52.626609, 1.300181);
    var myOptions = {
        zoom: 12,
        center: position,
        disableDefaultUI: true,
        zoomControl: true,
        zoomControlOptions: {
            style: google.maps.ZoomControlStyle.SMALL,
            position: google.maps.ControlPosition.RIGHT_CENTER
        },          
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var styles = [
        {
            featureType: 'water',  
            elementType: 'geometry.fill',  
            stylers: [  
                    { color: '#4AA8F0' }  
            ]  
        },
        {  
            featureType: 'landscape.natural',  
            elementType: 'all',  
            stylers: [  
                { color: '#ffffff' }
            ]  
        },
        {  
            featureType: 'road',  
            elementType: 'geometry',  
            stylers: [  
                { color: '#cccccc' } 
            ]  
        } 
    ];
    var map = new google.maps.Map(
        document.getElementById("map"),
        myOptions);
        map.setOptions({styles: styles});
</script>