Как исправить высоту яндекс карты?

Question

[TheRevan]

Есть яндекс карта:
Есть код инициализации карты:

$(document).ready(function(){
	if ($('.invoices-map').length) {
		ymaps.ready(initInvoicesMap);
	}
	console.log(ymaps);
})

function initInvoicesMap() {

	var multiRoute,
		mapText,
		mapLink;

	// Инициализация карту
	myInvoiceMap = new ymaps.Map($('.invoices-map')[0], {
		center: [55.752411, 37.623140],
		zoom: 9
	});
	console.log(myInvoiceMap);

}

Есть проблема: При загрузке страницы, если очень медленный интернет, то при обновлении страницы(именно обновлении, когда без кеша загружаешь страницу все норм) высота у карты становиться 0 пикселей и не делаются запросы на сервак на отрисовку блоков карты:


Также при любом изменении высоты экрана(из полноэкранного в обычный, или ресайз контента или браузера) карта встает на свои места:

Также при консоле логе карты выводит:

Comments

[Anton Mashletov]

Хороший дизайн crm'ки. Собственный или шаблон есть?

[TheRevan]

Anton Mashletov, собственный

[Александр Таратин]

TheRevan, Заказчик случайно не Александр Васильев (mdi-toys.ru) ?
Если да, то берите деньги вперед целиком.

Answer 1

[Егор Данченко]

Здесь спасёт только min-height

Comments

[TheRevan]

увы не спасает это, делал так, но проблема в том. что квадраты карт не грузит, т.е. нет картинок у карты

[Егор Данченко]

TheRevan, Ну это не ваши проблемы, вы никак исправить это не сможете. Можно только сделать так, чтобы пока карта не подгрузилась, была картинка.

[TheRevan]

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

Answer 2

[lloydbanks]

.invoices-map должен иметь какую-то высоту прежде чем загрузится карта. Коль вы используете 100% для абсолютного позиционирования, значит и родитель должен иметь какую-то высоту, иначе будет 0.
Попробуйте вместо 100% использовать 100vh

Comments

[TheRevan]

пробовал давать ему фискированую высоту - не помогло