Temat: Mapa z dynamicznie wyświetlanymi markerami z okienkami z...

Witam tworzę dynamiczną mapę google maps w api v3. Pobieram z tablicy js dane markerów i je wyświetlam.
Chciałbym, żeby po kliknięciu w marker otwierało się okienko z krótkim tytułem i linkiem - tytuł i link też pobierany z tablicy. Mam problem we wdrożeniu infowindow do przedstawionej niżej pętli. Próbowałem z rożnych tutoriali ale bezskutecznie... Czy ktoś mógłby pomóc?

Mapa jest tutaj: http://piekne-strony.pl/link/

Mam taki kod mapy w pliku map.js

//mapa

    var $headerMapCont = $('.map');

    if($headerMapCont.size() > 0){

    

        

      



        function initHeaderMap(){

            //

            function createHeaderMap($cnt, lat, lng){

                var opts = {

                    center: new google.maps.LatLng(lat, lng),

                    zoom: 6,

                    scrollwheel: true,

                    mapTypeId: google.maps.MapTypeId.ROADMAP,

                    styles: [{"featureType":"landscape","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"transit","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"poi","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"water","elementType":"labels","stylers":[{"visibility":"off"}]},{"featureType":"road","elementType":"labels.icon","stylers":[{"visibility":"off"}]},{"stylers":[{"hue":"#00aaff"},{"saturation":-100},{"gamma":2.15},{"lightness":12}]},{"featureType":"road","elementType":"labels.text.fill","stylers":[{"visibility":"on"},{"lightness":24}]},{"featureType":"road","elementType":"geometry","stylers":[{"lightness":57}]}]

                }

                // tworze mape do zm hm

                var headerMap = new google.maps.Map($cnt.get(0), opts);

                var image = 'http://piankinatryskowe.pl/izolacje/wp-content/themes/tuntheme/assets/favicon/favicon-32x32.png';



                

                if(worksList){

                    for(var entry in worksList){

                        

                        var geocoder = new google.maps.Geocoder();

                        

                        geocoder.geocode({

                            address: worksList[entry].city

                        }, function(results, status){

                            // jeśli status jest ok

                            if(status == google.maps.GeocoderStatus.OK){

                                //rysujemy na  mapce kółeczko

                                

                                /*var options = {

                                    strokeColor: "#000",

                                    strokeOpacity: 1,

                                    strokeWeight: 2,

                                    fillColor: "#f55b0c",

                                    fillOpacity: 0.8,

                                    center: results[0].geometry.location,

                                    map: headerMap,

                                    radius: worksList[entry].restaurantsCount * 20000

                                }

                                new google.maps.Circle(options);*/



                                //stawiam marker

                                var optionsMarker = {

                                    position: results[0].geometry.location,

                                    map: headerMap,

                                    title: worksList[entry].city,

                                    icon: image

                                }

                                new google.maps.Marker(optionsMarker);





                            }else{

                                alert("Geocode was not successful for the following reason: " + status);

                            }



                        });

                    }

                }



            }

        

            //prosimy o lokalizację

            if(navigator.geolocation) {

                //f zwrotna uruchomiona po wyrażeniu zgody na podanie położenia, position - aktualna pozyucja

                var success = function(position) {

                    //tworzy mapkę headerMapCont leci jako arg do f header map

                    createHeaderMap($headerMapCont, position.coords.latitude, position.coords.longitude)

                };



                var error = function() { 

                    createHeaderMap($headerMapCont, 52.259, 21.020); //warsaw coords

                }



                navigator.geolocation.getCurrentPosition(success, error);



            }else {

                // jeśli przegladarka nie obsługuje geo

                createHeaderMap($headerMapCont, 52.259, 21.020)

            }

        }

        //po załadowaniu drzewa dok i mapki

        google.maps.event.addDomListener(window, 'load', initHeaderMap);

    }

Pozdrawiam
Michał

Temat: Mapa z dynamicznie wyświetlanymi markerami z okienkami z...

Problem rozwiązany