Я пытаюсь создать презентацию поверх Reveal.js, которая будет включать карту Leaflet.js в одном из слайдов. Я включил весь необходимый Javascript & CSS-файлы в моей презентации Reveal.js, и я могу сделать карту отображаться на слайде.

Однако проблема в том, что плитки карты отображаются неправильно. Вместо реальных фрагментов карты я вижу только серый фон и горизонтальные черные линии. Я могу увеличивать / уменьшать и перемещать карту, и черные линии движутся соответственно.

В консоли Javascript нет сообщений об ошибках, и браузер, похоже, загружает листы карты с сервера точно так, как должен. Я считаю, что проблема как-то связана с кодом CSS листов листов Leaflet -.leaflet-tile в пределах leaflet.css - как-то несовместимо с Reveal.js.

Вопрос: кто-нибудь знает, как обойти эту проблему? Или это тупик без возможного решения?

У меня есть следующий CSS для:

#map {
    height:400px;
    width:100%;
}

РЕДАКТИРОВАТЬ: Одним из очевидных обходных путей для этого является использование тег для вставки карты в презентацию. Кажется, работает просто отлично, и, возможно, лучше держать рамки разделенными. Однако недостатком является то, что если в презентации есть несколько карт, каждая в пределах своейкопия Leaflet.js загружается в память для каждого кадра iframe.

РЕДАКТИРОВАТЬ № 2: Похоже, лучшим решением является использованиеPolymaps вместоLeaflet.js, Кажется, что несколькоPolymaps карты могут быть встроены вreveal.js presentaion. Без вопросов.