Эффект наведения JavaScript на Google Maps API при наведении указателя мыши - PullRequest
1 голос
/ 08 марта 2012

У меня есть массив координат для карты Google.Каждый набор координат получает свой индивидуальный маркер.Если пользователь наводит курсор мыши (при наведении курсора мыши), он заменяется другим значком (этот значок одинаков для всех маркеров).Моя проблема в том, что если пользователь делает мышку, я хочу восстановить исходную иконку, но я просто получаю последний созданный маркер (marker3.png) для всех маркеров.

Возможно, у вас есть идея.Вот сценарий:

$(document).ready(function(){
                            var locations = [
                            ['Dr. Christian Schrey', 52.499496, 13.316873, 4],
                            ['Dr. Teufel', 52.528664, 13.380232, 5],
                            ['Dr. Sebs Firma', 52.507839, 13.496490, 3],

                            ];

                            initialize();
                            var map;
                            function initialize() {
                            var myLatlng = new google.maps.LatLng(52.52427, 13.40629);
                            var myOptions = {
                                zoom: 11,
                                center: myLatlng,
                                mapTypeId: google.maps.MapTypeId.ROADMAP
                            }
                            map = new google.maps.Map(document.getElementById("Map"), myOptions);

                            var infowindow = new google.maps.InfoWindow();

                            var marker, i;
                            var y = 0;

                            for (i = 0; i < locations.length; i++) {  
                            y++;
                            image = 'http://xxx.de/test6/system/css/images/marker'+y+'.png';

                            marker = new google.maps.Marker({
                                position: new google.maps.LatLng(locations[i][1], locations[i][2]),
                                map: map,
                                icon: image
                            });

                            google.maps.event.addListener(marker, 'click', (function(marker, i) {
                                return function() {
                                infowindow.setContent(locations[i][0]);
                                infowindow.open(map, marker);
                                }
                            })(marker, i));

                            google.maps.event.addListener(marker, "mouseover", function(event) {
                            this.setIcon("http://xxx.de/test6/system/css/images/pfote_clean.png");
                            });

                            google.maps.event.addListener(marker, "mouseout", function(event) {
                            this.setIcon(image);
                            });

                            }

                        };
                    });

Я ценю любую помощь!Спасибо.

1 Ответ

2 голосов
/ 08 марта 2012

Вы можете сохранить URL внутри опций маркера:

marker = new google.maps.Marker({
     position: new google.maps.LatLng(locations[i][1], locations[i][2]),
     map: map,
     icon: image,
     src:image//<-
});

, тогда вы сможете получить URL позже в обратном вызове:

this.setIcon(this.src);
...