Как добавить геойсон в мою карту листовки? файл json не виден на карте - PullRequest
Новая
       28

Как добавить геойсон в мою карту листовки? файл json не виден на карте

0 голосов
/ 19 мая 2019

Я пытался загрузить файл geojson в мою карту. Мой файл geojson находится в другой папке с именем «data», а имя geojson - «street.json». Я хочу загрузить эти данные в мою карту листовки. как это возможно? Я попробовал следующий код: 

L.geoJSON('data/street.json').addTo(map);

1 Ответ

1 голос
/ 19 мая 2019

Если вы используете es6, вы можете использовать

import street from "./data/street.json"; где улица - ваш файл геойсона

и затем используйте L.geoJSON(street).addTo(map)

Вот пример es6 с геоджоном, чтобы увидеть его вживую.

Редактировать

Без использования es6 вам нужно:

Создав данные папки и файл street.json, вам нужно сохранить json внутри street.json с переменной, например 

var street = {
    "type": "FeatureCollection",
    "features": [
       {
          "type": "Feature",
          "geometry": {
          "type": "LineString",
          "coordinates": [
              [-105.00341892242432, 39.75383843460583],
              [-105.0008225440979, 39.751891803969535]
          ]
       },
       ...
}

и затем импортируйте его в index.html как 

<script src="./data/street.json"></script>

внутри <body>. Убедитесь, что вы создали папку внутри корня вашего проекта.

Поэтому у вас будет что-то подобное в вашем теле: 

<body>
    <div id="map"></div>
    <script src="./data/street.json"></script>

    <script src="script.js"></script>

</body>

и затем связать его с переменной улицы, которую вы определили внутри street.json: 

L.geoJSON(street).addTo(map)

plain js demo

...