Невозможно отобразить Листовой плейер

Я пытаюсь использовать Листовку для создания интерактивной карты. Однако у меня возникли проблемы с воспроизведением плейера. Я использую dustjs для визуализации HTML, который только дает мне пустую карту, например, так:Невозможно отобразить Листовой плейер

Первоначально я пытался выполнить это с помощью MapBox согласно Quick Start руководства. Я считаю, что у меня есть правильный маркер доступа,

var mymap = L.map('map').setView([51.505, -0.09], 13); 

    L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=XYZ', { 
     attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://mapbox.com">Mapbox</a>', 
     maxZoom: 18, 
     id: 'USERNAME.STYLEID', 
     accessToken: 'XYZ' 
    }).addTo(mymap);

Я получил свой стиль идентификатор из URL, как это:

Я также попытался использовать OSM, чтобы обойти любые проблемы с получение токена доступа и идентификатор проекта, так что я взял этот код из учебника я нашел:

var map = L.map('map', { 
     center: [43.64701, -79.39425], 
     zoom: 15 
    }); 

L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', { 
    attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors' 
}).addTo(map);

Но это также делает пустую карту.

Вот полный код дампа с помощью OSM:

<head> 
 
    <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css" /> 
 
    <link rel="stylesheet" href="/styles/leaflet.css" /> 
 
    <script src="../js/leaflet.js"></script> 
 
</head> 
 
<body onload="onload()"> 
 
    <div id="map"></div> 
 
    <script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script> 
 
    <script> 
 
     var map = L.map('map', { 
 
      center: [43.64701, -79.39425], 
 
      zoom: 15 
 
     }); 
 

 
     L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', { 
 
      attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors' 
 
     }).addTo(map); 
 
    </script> 
 
</body>

Заранее спасибо за любую помощь. Если вам нужна дополнительная информация, дайте мне знать.

источник

2016-12-25 Jack

Убедитесь, что у вас нет ненулевого размера (как ширины, так и высоты), прежде чем инициализировать компонент листовки. – lonelyelk

Можете ли вы проверить, правильно ли загружаются файлы css? – muzaffar

Ширина и высота @lonelyelk происходит из таблицы стилей, которая загружается перед всем остальным. – Jack

Похоже, что скобки в tilelayer не работают должным образом. По мере составления шаблонов компилятор пыли, вероятно, игнорирует параметры в {}

Включите файл *.js, а не inline-ing.

источник

2016-12-27 11:57:13 muzaffar

Невозможно отобразить Листовой плейер

ответ

Смежные вопросы