Question

This is my code :

<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>     
<script type="text/javascript">
    function load() {
        if (GBrowserIsCompatible()) {
            var map;
            var location = new google.maps.LatLng(46.084989, 11.118851);

            var stylez =
            [
              {
                  featureType: "all",
                  elementType: "all",
                  stylers: [
                  { saturation: -98 }
                ]
              }
            ];

            var mapOptions = {
                zoom: 11,
                center: location,
                mapTypeControlOptions: {
                    mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'myScale']
                }
            };

            map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
            var mapType = new google.maps.StyledMapType(stylez, { name: "Grayscale" });
            map.mapTypes.set('myScale', mapType);
            map.setMapTypeId('myScale')        
        }
    }

    $(document).ready(function(){
        load();
    });
</script>


<div id="map_canvas" style="width: 100%; height: 700px"></div>

but nothing is loaded. Where am I wrong? Removing GBrowserIsCompatible() it works, but it doesn’t recognize the location.

Answer 1

Map API V2 is deprecated use V3. If you remove GBrowserIsCompatible() it will work and the map will be centered at your desired coordinates.

To highlight better the location you could use a marker

var marker = new google.maps.Marker({
    position: location,
    map: map,
    title:"My location title"
});