Adsense with jquery-ui-map

Question

You can see below, my code to show a map and markers (from Json):

$('#map_canvas').gmap().bind('init', function() { 
    $.getJSON( '../js/locate.php', function(data) { 
        $.each( data.markers, function(i, marker) {
            var mapvalue=new google.maps.LatLng(marker.latitude, marker.longitude);  

            $('#map_canvas').gmap('addMarker', { 
                'tags': [''+marker.category+''],
                'position': mapvalue, 
                'bounds': true,                             
                'icon':'../images/'+marker.category+'.png',
                'animation':google.maps.Animation.DROP
            }).click(function() {
                $('#map_canvas').gmap('openInfoWindow', { 'content': ''+marker.category+'<BR><div id="cust_content"></div>' }, this);
                setTimeout("opencust(\'" +marker.id+"\');",100);
            });                 
        });                                      
    });  
});   

How can I include the new adsense script on my map: https://developers.google.com/maps/documentation/javascript/advertising#AdvertisingAdUnit

Thanks for your help!

Answer 1

After a little research I made it work with few changes. You need to perform the following steps.

1. First include Adsense in your Google Maps JS. Notice the addition of libraries=adsense&

    <script src="http://maps.google.com/maps/api/js?libraries=adsense&sensor=true"></script> 

2. Modify your JS as below. Notice $('#map_canvas').gmap('get','map')

    $('#map_canvas').gmap().bind('init', function() { $.getJSON( '../js/locate.php', function(data) { $.each( data.markers, function(i, marker) { var mapvalue=new google.maps.LatLng(marker.latitude, marker.longitude); $('#map_canvas').gmap('addMarker', { 'tags': [''+marker.category+''], 'position': mapvalue, 'bounds': true, 'icon':'../images/'+marker.category+'.png', 'animation':google.maps.Animation.DROP }).click(function() { $('#map_canvas').gmap('openInfoWindow', { 'content': ''+marker.category+'<BR><div id="cust_content"></div>' }, this); setTimeout("opencust(\\'" +marker.id+"\\');",100); }); }); }); var adUnitDiv = document.createElement('div'); var adUnitOptions = { format: google.maps.adsense.AdFormat.HALF_BANNER, position: google.maps.ControlPosition.TOP, backgroundColor: '#c4d4f3', borderColor: '#e5ecf9', titleColor: '#0000cc', textColor: '#000000', urlColor: '#009900', map: $('#map_canvas').gmap('get','map'), visible: true, publisherId: 'YOUR_PUBLISHER_ID' }; adUnit = new google.maps.adsense.AdUnit(adUnitDiv, adUnitOptions); });