Как фильтровать функции по статусу - PullRequest
0 голосов
/ 21 февраля 2020

Я хочу показать на своей карте в кластерном слое фильтрацию, если открыт или нет. Как это можно сделать? Должен ли я создать два слоя?

Один с фильтром: filter["has", "opened"], а другой с фильтром: filter["!", ["has", "opened"]]?

export const clusterLayerOpened = {
    id: "clusters",
    type: "circle",
    source: "earthquakes",
    filter: ["has", "opened"],
    paint: {
        "circle-color": [ "step", ["get", "opened"], "#51bbd6",100,"#f1f075",750,"#f28cb1", ],
        "circle-radius": ["step", ["get", "opened"], 20, 100, 30, 750, 40],
    },
};

export const clusterLayerNoOpened = {
    id: "clusters",
    type: "circle",
    source: "earthquakes",
    filter: ["!", ["has", "opened"]],
    paint: {
        "circle-color": [ "step", ["get", "opened"], "#51bbd6",100,"#f1f075",750,"#f28cb1", ],
        "circle-radius": ["step", ["get", "opened"], 20, 100, 30, 750, 40],
    },
};

Это мой гео json:

{
    "type": "FeatureCollection",
    "features": [{
            "type": "Feature",
            "properties": {
                "id": "ak16994521",
                "mag": 2.3,
                "time": 1507425650893,
                "felt": null,
                "tsunami": 0,
                "opened": true
            },
            "geometry": {
                "type": "Point",
                "coordinates": [-151.5129, 63.1016, 0.0]
            }
        },
        {
            "type": "Feature",
            "properties": {
                "id": "ak16994519",
                "mag": 1.7,
                "time": 1507425289659,
                "felt": null,
                "tsunami": 0,
                "opened": false
            },
            "geometry": {
                "type": "Point",
                "coordinates": [-150.4048, 63.1224, 105.5]
            }
        }
    ]
}

1 Ответ

2 голосов
/ 11 марта 2020

Нет необходимости создавать два отдельных слоя для фильтрации по тому, была ли точка открыта или нет. Вот некоторый код, показывающий, как добавить слой, который отображает все точки со свойством "opened": true и скрывает все точки с помощью "opened": false:

map.addLayer({
  'id': 'opened',
  'type': 'circle',
  'source': 'points',
  'paint': {
    'circle-radius': 10,
    'circle-opacity': ["match", ["to-string", ["get", "opened"]], 'true', 1 , 'false', 0, 0]
  }
});

Чтобы вместо этого показать все точки со свойством "opened": false Вы можете переключить выражение 'circle-opacity' следующим образом:

["match", ["to-string", ["get", "opened"]], 'true', 0 , 'false', 1, 0]

В этом коде используется несколько выражений Mapbox . Я связал документацию с каждым соответствующим выражением здесь: match, to-string и get.

Здесь является JSFiddle, где на карту добавляются два слоя: https://jsfiddle.net/hpkzrm4n/. Точки с "opened": true показаны красным, а точки с "opened": false показаны синим. Обратите внимание, что вам нужно будет добавить свой собственный токен доступа Mapbox, где это указано, для просмотра результатов. Вот скриншот, для предварительного просмотра:

Preview of code in JSFiddle

...