Карта Google не загружается, когда открыт Браузер

Question

У меня есть карта Google на моем веб-сайте, но карта не загружается на моем сайте. Но когда я открою карту проверки элементов, она будет работать, когда я закрою карту элементов-элементов, исчезнет автоматически. Не знаю, почему так происходит, Пожалуйста, дайте мне знать, в чем проблема. Вот моя карта код

Заранее спасибо

<div id="mapCanvas" style="width:100%; height:400px"></div> 
<input type="text" title="Latitude" id="latt_val"> 
<input type="text" title="Longitude" id="long_val"> 

 
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
 
    
 
<script type="text/javascript"> 
 
var geocoder = new google.maps.Geocoder(); 
 

 
function geocodePosition(pos) { 
 
    geocoder.geocode({ 
 
    latLng: pos 
 
    }, function(responses) { 
 
    if (responses && responses.length > 0) { 
 
     updateMarkerAddress(responses[0].formatted_address); 
 
    } else { 
 
     updateMarkerAddress('Cannot determine address at this location.'); 
 
    } 
 
    }); 
 
} 
 

 
function updateMarkerStatus(str) { 
 
    document.getElementById('markerStatus').innerHTML = str; 
 
} 
 

 
function updateMarkerPosition(latLng) { 
 
    document.getElementById('info').innerHTML = [ 
 
    latLng.lat(), 
 
    latLng.lng() 
 
    ].join(', '); 
 
    document.getElementById("latt_val").value = latLng.lat(); 
 
    document.getElementById("long_val").value = latLng.lng(); 
 
} 
 

 
function updateMarkerAddress(str) { 
 
    document.getElementById('address').innerHTML = str; 
 
} 
 

 
function initialize() { 
 
    var latLng = new google.maps.LatLng(15.486432009100538, 73.82759375); 
 
    var map = new google.maps.Map(document.getElementById('mapCanvas'), { 
 
    zoom: 12, 
 
    center: latLng, 
 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }); 
 
    var marker = new google.maps.Marker({ 
 
    position: latLng, 
 
    title: 'Point A', 
 
    map: map, 
 
    draggable: true 
 
    }); 
 
    
 
    // Update current position info. 
 
    updateMarkerPosition(latLng); 
 
    geocodePosition(latLng); 
 
    
 
    // Add dragging event listeners. 
 
    google.maps.event.addListener(marker, 'dragstart', function() { 
 
    updateMarkerAddress('Dragging...'); 
 
    }); 
 
    
 
    google.maps.event.addListener(marker, 'drag', function() { 
 
    updateMarkerStatus('Dragging...'); 
 
    updateMarkerPosition(marker.getPosition()); 
 
    }); 
 
    
 
    google.maps.event.addListener(marker, 'dragend', function() { 
 
    updateMarkerStatus('Drag ended'); 
 
    geocodePosition(marker.getPosition()); 
 
    }); 
 
google.maps.event.trigger(window,'resize',{}); 
 
} 
 
    
 
// Onload handler to fire off the app. 
 
google.maps.event.addDomListener(window, 'load', initialize); 
 
</script>

Answer 1

[UPDATE]

Эй, я все еще очень интересно, что происходит здесь. У вас в браузере включен AdBlocker, который может помешать загрузке карты? Вы проверили, работает ли это в нескольких браузерах?

Я сделал код нашей проблемы: http://codepen.io/trevorwhealy/pen/obRQdW. И ваша карта работает отлично. Если при загрузке этого пера вы все еще ничего не видите, я думаю, мы можем с уверенностью сказать, что это проблема с браузером.

[OLD POST]

Попробуйте поместить свой код:

google.maps.event.trigger(window,'resize',{}); // or trigger(map 

после

google.maps.event.addListener(marker, 'dragend', function() { 
    updateMarkerStatus('Drag ended'); 
    geocodePosition(marker.getPosition()); 
    }); 

, но все еще в пределах вашей функции инициализации.