Я использую картографический сервис LocationIQ: https://locationiq.com/docs и загружаю 3 сценария в заголовок моей страницы (в конкретном контроллере CMS 5):
$this->addHeaderItem($html->css("https://unpkg.com/leaflet@1.5.1/dist/leaflet.css"));
$this->addHeaderItem($html->javascript("https://unpkg.com/leaflet@1.5.1/dist/leaflet.js"));
$this->addHeaderItem($html->javascript("https://tiles.unwiredmaps.com/js/leaflet-unwired.js"));
тогда я настраиваю карты в поле зрения:
<div class="leaflet-map" data-jq="<?php echo h($data); ?>" style="height: <?php echo $height; ?>; width: <?php echo $width; ?>;"></div>
и в JS:
$(document).ready(function(e) {
$.each($('.leaflet-map[data-jq]'), function(index, element) {
var jq_data = $.parseJSON($(element).attr('data-jq'));
InitLeafletMap(element, jq_data);
});
});
function InitLeafletMap(element, jq_data) {
var myLeafletStreets = L.tileLayer.Unwired({ // <- ERROR HERE
key: jq_data.api_key,
scheme: "streets",
});
var myLeafletMap = L.map(element, {
center: [jq_data.latitude, jq_data.longitude],
zoom: jq_data.zoom ? jq_data.zoom : 16,
scrollWheelZoom : jq_data.lock_wheel,
layers: [myLeafletStreets],
});
L.control.scale().addTo(myLeafletMap);
и проблема в том, что иногда ошибки не возникают, но в большинстве случаев при загрузке страницы я получаю сообщение «TypeError: L.tileLayer.Unwired is not function» в строке, которую я показал выше.
Почему это происходит?
PS. Надо сказать, что я также использую другие карты на странице (2Gis и Yandex) - разные скрипты, разные библиотеки. Но если я использую только карты Leaflet - никаких ошибок. Если я использую другие карты, в большинстве случаев я получаю ошибку, но не всегда. Некоторые проблемы со временем?
[UPDATE]
Похоже, это решило проблему:
var Leaflet = L.noConflict();