0

我正在使用谷歌地图 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);

});

}

任何帮助表示赞赏。谢谢！

4

0 回答 0