Карта Google проблема

Тема в разделе "JavaScript", создана пользователем ModuLe, 21 окт 2015.

Модераторы: ZiX
  1. ModuLe

    ModuLe Создатель

    Регистр.:
    8 сен 2015
    Сообщения:
    33
    Симпатии:
    6
    Ребят что может быть за проблема, если сайт на нем карта Google загружен с помощью js скрипта, иногда загрузываеться карта а иногда нет и выбивает такую ошибку: Uncaught TypeError: window.initializeMap is not a function

    Код:
    <div class="map-wrapper">
                        <div class="map-canvas" id="map-canvas">Завантаження карти...</div>
    </div>
    
    <script>
    //Initialize google map for contact setion with your location.
    
    function initializeMap() {
    
        var lat = '49.8477374'; //Set your latitude.
        var lon = '24.0247954'; //Set your longitude.
    
        var centerLon = lon - 0.0105;
    
        var myOptions = {
            scrollwheel: false,
            draggable: false,
            disableDefaultUI: true,
            center: new google.maps.LatLng(lat, centerLon),
            zoom: 16,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
    
        //Bind map to elemet with id map-canvas
        var map = new google.maps.Map(document.getElementById('map-canvas'), myOptions);
        var marker = new google.maps.Marker({
            map: map,
            position: new google.maps.LatLng(lat, lon),
        });
    
        var contentString =
          '<div class="contact-form">'+
          '<h3>text</h3>'+
          '<p class="gallery"><b>on</b><br />' +
          '<b>map</b><p>' +
          '</div>';
         
        var infowindow = new google.maps.InfoWindow({
        content: contentString
      });
    
        google.maps.event.addListener(marker, 'click', function () {
            infowindow.open(map, marker);
        });
    
        infowindow.open(map, marker);
    }
    </script>
    
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false&amp;callback=initializeMap"></script>
    
     
  2. javx

    javx

    Регистр.:
    28 авг 2015
    Сообщения:
    526
    Симпатии:
    248
    C сайта гугла код взят? попробуй посмотреть какой сейчас код он даёт, может поменялось чего.
     
  3. ModuLe

    ModuLe Создатель

    Регистр.:
    8 сен 2015
    Сообщения:
    33
    Симпатии:
    6
    Странно один раз зашел по этому адресу код в 22 строк и вконце такая строка:
    https://maps.googleapis.com/maps-api-v3/api/js/22/9b/intl/uk_ALL/main.js

    а Иногда открываеться тот же код в 22 строк и + 90 строк из этого скрипт - https://maps.googleapis.com/maps-api-v3/api/js/22/9b/intl/uk_ALL/main.js

    почему так? Обновляя пару раз браузер у вас так же?
     
  4. ModuLe

    ModuLe Создатель

    Регистр.:
    8 сен 2015
    Сообщения:
    33
    Симпатии:
    6
    А вот если что тема в которой проблемы, на сайте автора так же карта грузиться через раз... - http://ivkovic.me/themes/pluton/#service
     
  5. javx

    javx

    Регистр.:
    28 авг 2015
    Сообщения:
    526
    Симпатии:
    248
    у меня вообще не грузится карта, лендингов с таким блоком в интернете море. Возьми с работающего примера js и не парься.
     
  6. norman_by

    norman_by Постоялец

    Регистр.:
    28 июн 2011
    Сообщения:
    69
    Симпатии:
    21
    не успевает загрузиться ядро гуглмапс, поэтому и выскакивает такое сообщение
    И еще непонятно, почему объявление переменной происходит ПОСЛЕ ее вызова. Возможно в этом ошибка - http://joxi.ru/8AnGbOzfDwDerO - достаточно перенести строку объявления переменной выше. Потому как скрипт может валиться на ошибку в месте вызова необъявленной переменной и следующая команда (вызов ядра гуглмапс) не отрабатывает просто.
     
  7. ModuLe

    ModuLe Создатель

    Регистр.:
    8 сен 2015
    Сообщения:
    33
    Симпатии:
    6
    Так значит проблема на сайти гугл? Или я чего-то не понял) Потому что код что на скриншоте это с сайта Google Maps API...
     
  8. norman_by

    norman_by Постоялец

    Регистр.:
    28 июн 2011
    Сообщения:
    69
    Симпатии:
    21
    гм. признаю - глянул по верхам. Давайте разберемся по порядку:
    1) <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false&amp;callback=initializeMap"></script>
    подключается гугл-мапс и коллбэком в строке подключения прописан вызов initializeMap. Данная функция определена до подключения карты и теоретически должна отрабатывать. Чего иногда не происходит и выскакивает сообщение "window.initializeMap is not a function". Предполагаю, что ядро гугл-карт не подгружается.
    2) поглядел на сайте автора. Словил вашу ошибку. Мои предположения оказались правильными. Если после загрузки страницы выполнить в консоли window.initializeMap() - карта отлично стартует. http://joxi.ru/ZrJNkGeuXxgprj

    Что делать:
    1) убираем каллбэк из строки подключения
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
    2) добавляем инициализацию карты после загрузки всей страницы
    google.maps.event.addDomListener(window,'load', initializeMap);
     
    Renny и ModuLe нравится это.
  9. ModuLe

    ModuLe Создатель

    Регистр.:
    8 сен 2015
    Сообщения:
    33
    Симпатии:
    6
    Спасибо, а то я в скриптах явы слаб, неучил вовсем, незнал об этом)

    Только что 5 раз обновил, все стабильно)

    тему можно закрывать
     
  10. den-ch-s

    den-ch-s Постоялец

    Регистр.:
    17 июл 2015
    Сообщения:
    77
    Симпатии:
    1
    Всем доброго времени суток, купили шаблон на сайт. Там встроенная гугл карта. Все подключили, ключ API добавили. Но при загрузке страницы он сперва на 1 секунду буквально показывает карту, а потом выдает ошибку ключа. Мол ключ не правильный. Как быть? что может быть? шаблон newstore.