Custom icon does not appear in Google Maps

0

I'm developing an app that loads a map with some custom tags, these tags work perfectly, but the icon property is not working. I already tried to put the icons of Google itself, tried to leave the default icon of marking, but nothing worked

 function criaMapa(lojas) {
            var map = new google.maps.Map(element[0], {
                center: {lat: -34.397, lng: 150.644},
                zoom: 5,
                disableDefaultUI: true
            });

            var marker = [];
            var infowindow = [];

            $.each(lojas.data, function (idx, obj) {
                var latLng = new google.maps.LatLng(obj.Loja_vch_Latitude, obj.Loja_vch_Longitude);

                marker[idx] = new google.maps.Marker({
                    position: latLng,
                    title: obj.Loja_vch_Titulo,
                    animation: google.maps.Animation.DROP,
                    icon: 'https://maps.google.com/mapfiles/kml/shapes/parking_lot_maps.png',
                    map: map
                });

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

                var sBalaoConteudo = '\
                    <div class="balao-mapa">\
                        <h1>' + obj.Loja_vch_Titulo + '</h1>\
                        <h2>' + obj.Loja_vch_Descricao + '</h2>\
                    </div>';

                infowindow.setContent(sBalaoConteudo);

                google.maps.event.addListener(marker[idx], 'click', function () {
                    infowindow.open(map, marker[idx]); // click on marker opens info window
                });

            });

            var infoWindow = new google.maps.InfoWindow({map: map});

        }

        $http({
            method: 'POST',
            url: webservice + 'Loja/Listar'
        }).then(function successCallback(response) {
            criaMapa(response);
        });

Thanks for the help right away

    
asked by anonymous 27.11.2017 / 15:20

2 answers

0

The problem is in one of these two places:

1- Return of your webservice (store variable) - > Debug and check exactly what is being returned.

2-element [0] - > Make sure this variable really has the map container div

I replaced these two variables to test your example and it worked normally.

Here's the working example of what you want: link

    
27.11.2017 / 16:35
0

I discovered what it is, the Google CSS was adding a max-height property, preventing the image from appearing, so I had to set that property, it worked perfectly.

Thanks for everyone's help

    
28.11.2017 / 15:15