In writing codes in the .NET framework, we can do the binding of data at the way in which the values gets binded according to the dataset received and the column generation is being made automatically.

But in that case, we need to bind the values, implicitly we need to use the directives for binding the data.

So for this we need to understand the use of directives which begins and ends with the %> symbol.

<script type="text/javascript">
    function initialize() {
        var markers = JSON.parse('<%=ConvertDataTabletoString() %>');
        var mapOptions = {
        center: new google.maps.LatLng(markers[0].lat, markers[0].lng),
zoom: 5,
mapTypeId: google.maps.MapTypeId.ROADMAP
//  marker:true
};
var infoWindow = new google.maps.InfoWindow();
var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
var image;
for (i = 0; i < markers.length; i++) {
var data = markers[i]
var myLatlng = new google.maps.LatLng(data.lat, data.lng);

var contentString = '<div id="content" style="margin-left:15px; margin-top:3px;overflow:hidden;">' +
'<div id="bodyContent">' + '<img src=' + data.image + ' style="width:172px;height:45px;"  alt="WebStreet.in"/>' + '<br><font style="color:darkblue;font:11px tahoma;margin-left:5px;">' + data.title + ' Your Trusted IT Solutions Provider</font>' +
'</div>' +
'</div>';


//var marker = new google.maps.Marker({

//position: myLatlng,
//map: map,
//title: data.title,
//});

var marker = new google.maps.Marker({
    map: map,
    // draggable:true,
    // animation: google.maps.Animation.DROP,
    position: myLatlng,
    title: data.title,
    icon: 'http://maps.google.com/mapfiles/kml/pal3/icon55.png' // null = default icon
});


    // Start of newly added code block

var infowindow = new google.maps.InfoWindow({
    content: contentString,
    width: 192,
    height: 100
});


(function (marker, data) {

    // Attaching a click event to the current marker
    google.maps.event.addListener(marker, "click", function (e) {
        infoWindow.setContent(data.description);
        infowindow.open(map, marker);
    });


   
})(marker, data);


}
    
     
        // End of newly added code block
    }



</script>