Загрузите исходный файл Geojson и создайте слой для объектов с такими же свойствами - PullRequest
Новая
       5

Загрузите исходный файл Geojson и создайте слой для объектов с такими же свойствами

0 голосов
/ 16 ноября 2018

Я сделал этот пример https://www.mapbox.com/mapbox-gl-js/example/filter-markers/, но с полигонами из данных геойсона. Это работает, но когда я пытаюсь загрузить данные geojson из файла, я получаю ошибку ниже

Uncaught TypeError: Невозможно прочитать свойство 'forEach' из неопределенного 

mapboxgl.accessToken = '<my token>';
//var places = {"type":"FeatureCollection","features":[{"type":"Feature","properties":{"icon":"Mannheim"},"geometry":{"type":"Polygon","coordinates":[[[8.931884765625,48.73445537176822],[9.876708984375,48.73445537176822],[9.876708984375,49.24629332459796],[8.931884765625,49.24629332459796],[8.931884765625,48.73445537176822]]]}},{"type":"Feature","properties":{"icon":"Lindau"},"geometry":{"type":"Polygon","coordinates":[[[11.22802734375,48.36354888898689],[12.359619140624998,48.36354888898689],[12.359619140624998,49.088257784724675],[11.22802734375,49.088257784724675],[11.22802734375,48.36354888898689]]]}}]}
var places = "yes.geojson";


var filterGroup = document.getElementById('filter-group');
var map = new mapboxgl.Map({
    container: 'map',
    style: 'mapbox://styles/mapbox/light-v9',
    center: [10.307, 50.543],
    zoom: 5.45
});

map.on('load', function() {
    // Add a GeoJSON source containing place coordinates and information.
    map.addSource("places", {
        "type": "geojson",
        "data": places
    });

    places.features.forEach(function(feature) {
        var symbol = feature.properties['icon'];
        var layerID = 'poi-' + symbol;

        // Add a layer for this symbol type if it hasn't been added already.
        if (!map.getLayer(layerID)) {
            map.addLayer({
                "id": layerID,
                "type": "fill",
                "source": "places",
                "paint": {
                    "fill-color": "#2E88D6",
                    "fill-opacity": 0.4
            },
            "filter": ["==", "icon", symbol]
            });

            // Add checkbox and label elements for the layer.
            var input = document.createElement('input');
            input.type = 'checkbox';
            input.id = layerID;
            input.checked = true;
            filterGroup.appendChild(input);

            var label = document.createElement('label');
            label.setAttribute('for', layerID);
            label.textContent = symbol;
            filterGroup.appendChild(label);

            // When the checkbox changes, update the visibility of the layer.
            input.addEventListener('change', function(e) {
                map.setLayoutProperty(layerID, 'visibility',
                    e.target.checked ? 'visible' : 'none');
            });
        }
    });
});

если я установил var places = "yes.geojson;", он больше не работал.

...