Salut, je trouve cette probléme en affichage google map avec google chrome

voilà probléme:

et voilà code :

 <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDyti5TRAh2BJaik5Aa_HIOhee3cmZrLD0&signed_in=true&callback=initMap"
                async defer></script> 
         <script>
        function initMap() {
          var map = new google.maps.Map(document.getElementById('map'), {
            zoom: 12,
            {%if profil.getVilleLoc()!=null %}
               center: {lat: {{profil.getVilleLoc().getLatitude()}}, lng: {{profil.getVilleLoc().getLongitude()}}}
            {%else %}

        center: {lat: 48.866667 , lng:2.333333}
        {%endif%}
          });

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

        var marker = new google.maps.Marker({
            {%if profil.getVilleLoc()!=null %}
            position: {lat: {{profil.getVilleLoc().getLatitude()}}, lng:{{profil.getVilleLoc().getLongitude()}}},

            map: map,
            title: '{{profil.getVilleLoc.getDesignationVille()}}'
            {%else %}
                 position: {lat: 48.866667 , lng:2.333333},
            map: map,
            title: 'Paris'
            {%endif%}
          });
          marker.setMap(map);
        document.getElementById('submit').addEventListener('click', function() {
            geocodeAddress(geocoder, map);
          });

        }

        function geocodeAddress(geocoder, resultsMap) {
          var address = document.getElementById('confadr').value;
          geocoder.geocode({'address': address}, function(results, status) {
            if (status === google.maps.GeocoderStatus.OK) {
              resultsMap.setCenter(results[0].geometry.location);
              var marker = new google.maps.Marker({
                map: resultsMap,
                position: results[0].geometry.location
              });

                 var latitude = results[0].geometry.location.lat();
                 var longitude = results[0].geometry.location.lng(); 
                 var input1 = document.getElementById('latitude');
        input1.value = latitude;
         var input2 = document.getElementById('longitude');

        input2.value=longitude;

        console.log($('#longitude').val());

            } else {
              alert('Geocode was not successful for the following reason: ' + status);
            }
          });
        }

aide moi s'il vous plait pour résoudre cette probléme

2 réponses


Salut,

Ton élément ayant l'id map existe-t-il bien ?

Tu utilises Twig pour générer ton template (à ce que je vois), es-tu certain que tous les éléments générés par le moteur de template sont bien présent ?

med001
Auteur

ui l'élément à l'id map est exitse et aussi les éléments générés par le moteur de template bien présent , probléme je trouve seulement sur chrome , en firefox fonctionne map