При масштабировании карты колесиком мыши, остается кусок карты какой был виден, а все остальное серый фон или вовсе только серый фон. Посмотреть можно здесь: http://foxycars.ru/contacts.php
<script src="http://maps.google.com/maps/api/js?sensor=false"> </script>
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDzNIyGDobc2t0UwmhweJPEAQP6FLaNqRk&callback=initMap">
</script>
<script>
var map;
function initialize() {
var mapOptions = {
zoom: 13,
center: new google.maps.LatLng(<?php echo $center_map; ?>),
scrollwheel: true
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var directionsDisplay = new google.maps.DirectionsRenderer();
var directionsService = new google.maps.DirectionsService();
directionsDisplay.setMap(map);
directionsDisplay.setOptions( { suppressMarkers: true, suppressInfoWindows: true } );
var start_point = new google.maps.LatLng(<?php echo $coordinates_start; ?>);
var end_point = new google.maps.LatLng(<?php echo $coordinates_end; ?>);
var marker = new google.maps.Marker({
position: start_point,
map: map
});
var marker = new google.maps.Marker({
position: end_point,
map: map,
icon: 'img/marker-car.png'
});
google.maps.event.addListener(marker, 'click', function () {
infowindow.open(map, this);
});
var request = {
origin: start_point,
destination: end_point,
travelMode: google.maps.TravelMode.WALKING,
unitSystem: google.maps.UnitSystem.METRIC,
provideRouteAlternatives: true,
avoidHighways: false,
avoidTolls: true
};
directionsService.route(request, function(result, status) {
if (status == google.maps.DirectionsStatus.OK) {
directionsDisplay.setDirections(result);
var routes = result.routes;
var leg = routes[0].legs;
var lenght = leg[0].distance.text;
var duration = leg[0].duration.text;
infowindow = new google.maps.InfoWindow({ content: 'Дистанция: '+lenght});
infowindow.open(map, marker);
}
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
Проблема скорее всего в том, что код API подключен на странице два раза:
<script src="http://maps.google.com/maps/api/js?sensor=false"> </script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDzNIyGDobc2t0UwmhweJPEAQP6FLaNqRk&callback=initMap"></script>
Сообщение в консоли:
You have included the Google Maps API multiple times on this page. This may cause unexpected errors.
Кофе для программистов: как напиток влияет на продуктивность кодеров?
Рекламные вывески: как привлечь внимание и увеличить продажи
Стратегії та тренди в SMM - Технології, що формують майбутнє сьогодні
Выделенный сервер, что это, для чего нужен и какие характеристики важны?
Современные решения для бизнеса: как облачные и виртуальные технологии меняют рынок
Необходимо возвратить некоторые из CSS свойств элемента HTML-страницы в понятном виде для Edge, IEКонкретно: необходимо вернуть значения отступов...
Как удалить класс у другого элемента, после того как было заполнен input или textarea?
Пытаюсь сделать плагин для JqueryВот его максимально упрощенная версия: