Добавление набора географических данных JSON в качестве слоя в Mapbox GL- JS - PullRequest
Новая
       4

Добавление набора географических данных JSON в качестве слоя в Mapbox GL- JS

0 голосов
/ 10 марта 2020

Я хочу добавить набор плиток geo JSON на мою карту в качестве слоя. (Это данные метеорологического радара - они будут размещаться на моем сервере, поскольку данные обновляются каждые несколько минут.) Как это сделать и стилизовать? Возможно, это кажется глупым вопросом, но я искал повсюду без решения. Я вижу этот Mapbox GL- JS пример векторного набора тайлов , но он не показывает, как сделать векторный набор тайлов из geo JSON.

Все, что я хотел бы сделать, это добавить слой и стиль его по цвету.

Пример кода ближайший , который я могу найти в Mapbox: 

   map.on('load', function() {
    map.addSource('mapbox-terrain', {
        type: 'vector',
        url: 'mapbox://mapbox.mapbox-terrain-v2'
    });
    map.addLayer({
        'id': 'terrain-data',
        'type': 'line',
        'source': 'mapbox-terrain',
        'source-layer': 'contour',
        'layout': {
            'line-join': 'round',
            'line-cap': 'round'
        },
        'paint': {
            'line-color': '#ff69b4',
            'line-width': 1
        }
    });
});

Однако, как бы я ни пытался его редактировать, Я не понимаю, как изменить источник на geo JSON. (Я попытался изменить, например, type на geo JSON и изменить URL-адрес на мой файл. JSON. Единственный результат - ничего не отображается, даже с использованием стиля по умолчанию.

Вот как устроены мои данные и как я хочу их стилизовать: 

   {
    "type": "Feature",
    "geometry": {      "type": "Polygon",
      "coordinates": [
        [
          [-98.04771180146541, 29.69276273017396],
          [-98.04989507423406, 29.691557294069924],
          [-98.05007422056916, 29.691808116379576],
          [-98.04787303016978, 29.69298847287841],
          [-98.04771180146541, 29.69276273017396]
        ]
      ]
     },
     "properties": {
        "sweep": 1,
        "sweepTime": "2017-02-20T04:40:19Z",
        "elevAngle": 0.519104,
        "value": 21.0, //  << this value determines color of polygon styling (0-70)
        "radialAng": 238.16986,
        "begGateRan": 2249.9092,
        "endGateRan": 2499.8992,
        "heightRel": 20.683022,
        "heightASL": 213.62143
     }
   }

Надеюсь, я не растерялся, но в ответ на переполнение стека , Стив Беннет объясняет кому-то по теме topi c:

Насколько мне известно, Mapbox-GL- JS использует Geo JSON -VT для автоматического преобразования загруженного на стороне клиента Geo JSON файлы в векторные плитки в браузере

Так что, похоже, это можно сделать - но как? Большая часть документации предназначена для использования Mapbox Studio, и я просто пытаюсь сделать это через Javascript. Любая помощь приветствуется, так как это было проблемой в течение долгого времени, и сейчас я посвящаю все свое время ее решению.

В качестве финального наглядного изображения, это то, что я пытаюсь выполнить sh по карте:

radar image* 1 033 *

1 Ответ

1 голос
/ 10 марта 2020

Если вы имеете в виду «Geo JSON source», а не «Geo JSON tileset», это просто: 


map.on('load', function() {
    map.addSource('mysource', {
        type: 'geojson',
        url: 'http://example.com/mycode.geojson'
    });
    map.addLayer({
        'id': 'mylayer',
        'type': 'line',
        'source': 'mysource',
    });
});
...