CODEWITHSUNDEEP
google-maps-api-3infowindowgoogle-street-view
Fran Rod
Fran Rod

Reputation: 596

Can't close infowindow and display street view

I'm trying to close an infowindow wich displays a streetview. When I click on the map, the infowindow is not closed. Also when I click over other marker an infowindow is opened but the streetview opens in the previous infowindow. So I need that the infowindow get closed and displays the streetview. Here is the code: thank you for your help.

Best regards.

function paradascamiones() {
google.maps.event.addListener(map, 'click', function() {
infowindow.close();
});
var Boton = document.getElementById('Boton').value;
var textboxImei = document.getElementById('imei').value;
var textboxFecha = document.getElementById('fecha').value;
var textboxFechaFin = document.getElementById('fechaFin').value;
var textboxDesdeHora = document.getElementById('desdeHora').value;
var textboxHastaHora = document.getElementById('hastaHora').
downloadUrl("paradas.asp?imei="+textboxImei+"&fecha="+textboxFecha+" "+textboxDesdeHora+"&fechaFin="+textboxFechaFin+" "+textboxHastaHora, 
function(data) {
    var xml = xmlParse(data);
    var markersParadas = xml.documentElement.getElementsByTagName("marker");    
    var position = [];


    for (var i = 0; i < markersParadas.length; i++) {

    var lat = parseFloat(markersParadas[i].getAttribute("lat"));
    var lng = parseFloat(markersParadas[i].getAttribute("lng"));
    var myLatlngParadas = new google.maps.LatLng(lat, lng);

    var fechaInicio = markersParadas[i].getAttribute("fechaInicio");
    var fechaFinal = markersParadas[i].getAttribute("fechaFinal");
    var diferencia = markersParadas[i].getAttribute("diferencia");


    var datearray = diferencia.split("/"); 

    var newDate = datearray[1] + '/' + datearray[0] + '/' + datearray[2];
    var aFecha = new Date(newDate);
        var hours = aFecha.getHours();
        var minutes = aFecha.getMinutes();
        var seconds = aFecha.getSeconds();

    var markerParadas = createMarkerParadas(myLatlngParadas, hours, minutes, seconds, fechaInicio);
    myMarkersParadas.push(markerParadas);


  }//finish loop



}); //end download url

}


 function createMarkerParadas(myLatlngParadas, hours, minutes, seconds, fechaInicio) {


    var contentString = '<div id="content" style="width:350px;height:300px;"> </div>';
    var infoWindow = new google.maps.InfoWindow({
      content: contentString
   });
  var image2 = '/artworks/icons/stop.png';
  var markerParadas = new google.maps.Marker({
  position: myLatlngParadas,
  map: map,
  title: " my info ",
  icon: image2

});

    google.maps.event.addListener(markerParadas, "click", function () {

            infoWindow.open(map, markerParadas);

            var pano = null;
            google.maps.event.addListener(infoWindow, 'domready', function () {

                if (pano != null) {
                    pano.unbind("position");
                    pano.setVisible(false);
                }
                pano = new  google.maps.StreetViewPanorama(document.getElementById("content"), {
                    navigationControl: true,

                    enableCloseButton: false,
                    addressControl: true,
                    linksControl: false
                });
                pano.bindTo("position", markerParadas);
                pano.setVisible(true);
            });

            google.maps.event.addListener(infoWindow, 'closeclick', function () {
                pano.unbind("position");
                pano.setVisible(false);
                pano = null;
            });

    }); 



   return markerParadas;


 }

Upvotes: 0

Views: 468

Answers (1)

wf9a5m75
wf9a5m75

Reputation: 6158

In your code, at least you should change that defining the infowindow variable as global scope.

your code

function createMarkerParadas() {
    var infoWindow = new google.maps.InfoWindow({
      content : contentString
    });
    ...
}

Change to like this;

<script type="text/javascript">
    var map, infowindow;
    ...

    function createMarkerParadas() {
        infoWindow = new google.maps.InfoWindow({
          content : contentString
        });
        ....
    }
</script>

Upvotes: 1

Related Questions