Изменились функции API Google карт - масштаб стал максимальным ;(


Feb 16, 2018
Изменились функции API Google карт - масштаб стал максимальным ;(

Привет, мой друг!
На днях Google преподнес очередной сюрприз - изменились функции API Google карт и масштаб на действующих картах, встроенных в сайт, стал максимальным по умолчанию - выглядит это не очень, мягко говоря :(

Вы смотрите на карту, а там поле и метка по-центру и чтоб понять где все это нужно зумить до нужного и понятного вам масштаба.

Как бороться с максимальным масштабом по умолчанию на Googl картах на действующих сайта?

Найдите, где у вас подключается api google maps, обычно это файл index.html

Замените на <script async defer src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap"></script>

где YOUR_API_KEY - замените на свой ключ (который у вас уже должен был быть)

Эту строчку кода <script type='text/javascript' src='js/google-maps.min.js'></script> - удалите

Далее откройте файл js/map.js

И замените его содержимое на это:

//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
function initMap() {
var uluru = {lat: 59.95870772422682, lng: 30.3100860491395};
var map = new google.maps.Map(document.getElementById('google-map'), {
zoom: 16,
center: uluru
});

var contentString = '<div id="content">'+
'<h2>Заголовок</h2>'+
'<div id="bodyContent">'+
'<p><b>Какой-либо текст</b>. Сайт рыбатекст поможет дизайнеру, верстальщику, вебмастеру сгенерировать несколько абзацев более менее осмысленного текста рыбы на русском языке, а начинающему оратору отточить навык публичных выступлений в домашних условиях.' +
'<p>При создании генератора мы использовали небезизвестный универсальный код речей.</p>'+
'</div>'+
'</div>';
var infowindow = new google.maps.InfoWindow({
content: contentString
});
var marker = new google.maps.Marker({
position: uluru,
map: map,
icon: {
url: "images/map-marker.png",
scaledSize: new google.maps.Size(31, 45)
}
});
marker.addListener('click', function() {
infowindow.open(map, marker);
});
}

//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////

где - lat: 59.95870772422682, lng: 30.3100860491395 - это координаты центра арты и маркера (перенесите их из своего старого скрипта)

в переменную var contentString можно прописать заголовок и какой-либо текст. По клику на маркер будет появляться этот текст.

если этого не нужно, то закомментируйте или удалите код:

///////////////////////////////////////////////

marker.addListener('click', function() {

infowindow.open(map, marker);

});

///////////////////////////////////////////////

PS Рекомендую скачать код замены в текстовом файле, а не копировать его из статьи.
Код в текстовом файле.