Запрет скролла над картами google

399
02 мая 2017, 07:06

Я видел подобные вопросы на этом ресурсе и на оригинальном и у меня все-равно проблема.

  1. Для того что бы использовать scrollwheel: false нужно подключать google maps API, верно?
  2. Что бы использовать Google Maps API нужно пойти на сайт и нажать там получить ключ.

  3. После получения ключа мы делаем это(и вставляем туда свой ключ):

    <script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"></script>

  4. Пишем следующее:

    options = $.extend({ scrollwheel: false, mapTypeId: google.maps.MapTypeId.ROADMAP }, options); var map = new google.maps.Map($('contact-map'), options);

Во-первых. Обязательно подключать API что бы попросту выключить скролл?

Во-вторых вот так выглядит моя ошибка:

Uncaught kc {message: "initMap is not a function", name: "InvalidValueError", stack: "Error↵ at new kc (https://maps.googleapis.com/m…jKzYQ8Di2M3T49Vxa_el_zFyw&callback=initMap:135:73"}

Что я делаю не так?

Answer 1

Во-первых. Обязательно подключать API что бы попросту выключить скролл?

Видимо, обязательно.

Вот пример встроенной карты без скролла. Взято отсюда.

  $('.map-container') 
  .click(function() { 
    $(this).find('iframe').addClass('clicked')}) 
  .mouseleave(function() { 
    $(this).find('iframe').removeClass('clicked') 
});
.map-container { 
  width: 100%; 
  margin: 50px 0 3000px; 
} 
.map-container iframe { 
  width: 100%; 
  display: block; 
  pointer-events: none; 
  position: relative; /* IE needs a position other than static */ 
} 
.map-container iframe.clicked { 
  pointer-events: auto; 
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
<div class="map-container"> 
  <iframe width="300" height="450" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://www.google.com/maps/embed/v1/place?q=Status201%20Web%20Development&amp;key=AIzaSyCCGx7iveK21dme8OuLgX9Je7TUDDCw3_A"></iframe> 
</div>

ПОСЛЕДНИЕ ВОПРОСЫ
Все вопросы
Подробнее о сайте web-king.com.ua
ТОП-10
READ ALSO
html checkbox values to array and ajax
javascript

html checkbox values to array and ajax

здравствуйте, есть несколько чекбоксов, как показано на скриншоте

 438
Записать в БД несколько строк сразу
javascript

Записать в БД несколько строк сразу

СУБД: MySQL 55, сервер: Apache 24, PHP 7, пробую сделать без фреймворков

 292
Производительность web-страницы и Electron/NW.js
javascript

Производительность web-страницы и Electron/NW.js

Как я понимаю Electron/NWjs по сути просто открывает окно браузера с нужным контентом, но если взять web-страницу и открыть её в Chrome и ту же саму страницу...

 336
Не отображается объект в three.js
javascript

Не отображается объект в three.js

Я пишу код, для добавленияobj, созданного с помощью Blender, в three

 301