Пытаюсь сделать банальное всплывающее окошко с картой, которое показывается при клике по ссылке с ленивой загрузкой карты (т.к. ссылка в шапке на всех страницах сайта).
Пока пришёл к такому коду
// Yandex Map
$(function() {
var elem = $('<div/>').css({ width: '100%', height: '100%' });
var script = document.createElement('script');
script.type = 'text/javascript';
script.async = true;
script.src = '//api-maps.yandex.ru/services/constructor/1.0/js/ ?sid=-Qv5nMlIZM9hamrfjmh6 1mz9tklg-1LR';
$(document).on('click', '[role="yandex-map"]', function(e) {
e.preventDefault();
$(this).blur();
$.fancybox({
type: 'inline',
autoSize: false,
width: '95%',
height: '95%',
content: elem,
afterShow: function() {
script && elem[0].appendChild(script);
script = null;
}
});
});
});
И он в общем работает. Хотелось бы ещё пару вещей:
1) Т.к. сама карта не умеет "нормально" обновлять свои размеры при изменении размеров контейнера, хочется принудительно её резайзить. В прошлой версии это можно было сделать с помощью map.container.fitToViewport();
, но там можно было отловить создание объекта map
. Можно ли как-то это сделать в этой версии?
2) Хочется отлавливать событие "Карта загружена", чтобы пользователю отображать индикацию загрузки и прятать по событию.