Загрузка внешнего файла geojson в карточку листовки с помощью листовки ajax

Question

Я пытаюсь загрузить внешний geojson, используя буклет ajax. Я думаю, что структура geojson истинна. Это link. Вот что я сделал на основе HERE:

в голове:

<script src="../external/js/leaflet.js"></script> 
<script src="../external/js/leaflet.functionaltilelayer.js"></script> 
<script src="../external/js/leaflet.ajax.min.js"></script> 

В JavaScript:

var mymap = L.map('mapid',{ center: new L.LatLng(the_center_splitted[0],the_center_splitted[1]),maxZoom: 17, minZoom:11, zoom: 14}); //creating the map 

var gs = new L.TileLayer('../external/maps/qom/gs/gs_{x}_{y}_{z}.jpg', {opacity: 1,scheme: 'TMS'}).addTo(mymap); //loading image layer 

var geojsonLayer = new L.GeoJSON.AJAX("../external/map/qom/geojson/qom.geojson"); 

geojsonLayer.addTo(mymap); 

Но файл GeoJSON не отображается, и я получаю эту ошибку: ncaught TypeError: L.GeoJSON.AJAX не является конструктором
Я ценю, если кто-нибудь может помочь. Спасибо.

Answer 1

Что такое "functionaltilelayer.js" для? В фрагменте кода вам это не нужно. И var gs = new L.tileLayer с более низким t - измените это и попробуйте еще раз!

<script src="../external/js/leaflet.js"></script> 
<script src="../external/js/leaflet.ajax.min.js"></script> 

var mymap = L.map('mapid',{ center: new L.LatLng(the_center_splitted[0],the_center_splitted[1]),maxZoom: 17, minZoom:11, zoom: 14}); //creating the map 

var gs = new L.TileLayer('../external/maps/qom/gs/gs_{x}_{y}_{z}.jpg', {opacity: 1,tms: true}).addTo(mymap); //loading image layer 

var geojsonLayer = new L.GeoJSON.AJAX("../external/map/qom/geojson/qom.geojson"); 

geojsonLayer.addTo(mymap); 

Answer 2

Ваш код кажется, хорошо - вы импортировать

<script src='leaflet-ajax.js'></script> 

Если да, пожалуйста, покажите весь свой код!

Answer 3

Его немного сложно импортировать файлы через AJAX. Прежде всего помните, что относительный путь, который вы даете методу AJAX(), должен быть вашим файлом Geojson, должен быть путь от местоположения файла сценария листовки-ajax. (Так как там выполняется AJAX-вызов).

Я бы рекомендовал другой подход (без AJAX вызовов):

Ваш файл GeJson (переименовать его в gejson.js) должен выглядеть следующим образом:

var json = { "type": "FeatureCollection", 
      "features": [{ 
      ... 

Импорт этот файл перед вашей листовке AJAX код:

<script src="../../geojson.js" type="text/javascript"></script> 

Это даст вам доступ к переменной с именем json который затем можно использовать для импорта объекта JSON в вашем слое:

var geojsonLayer = L.geoJSON().addTo(mymap); 
geojsonLayer.addData(json);