javascript - Google Maps API v3 – 複数のマーカー、複数の情報ウィンドウ - サーバー側 VB.net

Question

Google マップ API v3 とサーバー側 vb.net を使用してプロジェクトに取り組んでおり、情報ウィンドウでマーカーをクリックすると表示されるようにしようとしています。私はこれを達成しましたが、今私が望むのは、私が理解できないように見えるさまざまなマーカーをクリックしたときに表示されるさまざまなコンテンツです。

var markers = [

<asp:Repeater ID="rptMarkers" runat="server">
<ItemTemplate>
            {
            "JSN": '<%# Eval("JSN") %>',
            "Address": "<%# Eval("Address") %>",
            "Postcode": "<%# Eval("Postcode") %>",
            "StartTime": "<%# Eval("StartTime") %>",
             "TownCity": "<%# Eval("TownCity") %>",
              "County": "<%# Eval("County") %>"
        }
</ItemTemplate>
<SeparatorTemplate>
    ,
</SeparatorTemplate>
</asp:Repeater>
];



 function loadDefaultMap(lat,lng,index) {
 var mapOptions = {
            center: new google.maps.LatLng(lat, lng),
            zoom: 8,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        var infoWindow = new google.maps.InfoWindow();
        var map = new google.maps.Map(document.getElementById("dvMap"), mapOptions);
 }


        function addMarkers() {
        // get address
        // In loop get each address (latitude,longitude)
        // call loadMap in each iteration
        if(markers.length >0){

        /// ******************************** INITIALIZING  **********************
         var mapOptions = {
            center: new google.maps.LatLng(52.630886,1.297355),
            zoom: 8,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };

        var infoWindow = null;
        var map = new google.maps.Map(document.getElementById("dvMap"), mapOptions);
        /// *********************************************************************

        var geocoder = new google.maps.Geocoder();
        for (i = 0; i < markers.length; i++) {

            var data = markers[i];
            var icon='';            
            var Time=data.StartTime.split(':');

            infoWindow = new google.maps.InfoWindow({

            content:markers[i].Address +"<br><b> "+markers[i].TownCity+" </b>"+ markers[i].County
            });
            if(Time[0] > 00 && Time[0] < 11){
             icon= '../../../Images/blue.png'
            }
            else
            {
             icon= '../../../Images/red.png'
            }
            var adrs= data.Address +" "+data.TownCity+" "+ data.County
            geocoder.geocode({ 'address': adrs }, function (results, status) {
                if (status == google.maps.GeocoderStatus.OK) {

                   var lat = results[0].geometry.location.lat();
                   var lng = results[0].geometry.location.lng();

                   //********************ADDING MARKER****************************

                    var myLatlng = new google.maps.LatLng(lat,lng);
                    var marker = new google.maps.Marker({
                    position: myLatlng,
                    map: map,
                    title: data.Address +" "+data.TownCity+" "+ data.County,
                    icon: icon
                });



                (function (marker, data) {
                    google.maps.event.addListener(marker, "click", function (e) {
                        infoWindow.open(map, this);
                    });
                })(marker, data);
                   //*************************************************************

                }

        });
        }
        }else{
        loadDefaultMap(52.630886,1.297355,-1);
        }
        }

    function pageLoad() {         
        addMarkers();
   }

これにより、マップにバインドされた最後のマーカーが常に表示されるため、情報ウィンドウは常に最後のマーカーに表示されました。私もこれを試してみましたが、うまくいきません。

for (var i = 0; i < markers.length; i++) {
var marker = markers[i];
google.maps.event.addListener(marker, 'click', function () {
infowindow.setContent(this.html);
infowindow.open(map, this);

});

}

どんな助けでも大歓迎です。ありがとう！