Стиль выполнения Mapbox JS из коллекции

Итак, у меня есть набор плиток Mapbox, который я загрузил с информацией о блоках переписи для США. Каждая геометрия в наборе тайлов имеет свойство под названием GeoID, к которому я пытаюсь применить стиль на основе другой моей коллекции.

Коллекция представляет собой объекты массива с таким форматом: [{geoid: string, weight: number}, {geoid: string, weight: number},...]

Я хочу сопоставить GeoID из массива со слоем из набора тайлов и раскрасить его на основе соответствующего свойства веса этого объекта. Вес - это число от 0 до 1. Я попытался выполнить поиск в документации по стилям и выражениям во время выполнения из Mapbox, но я не могу найти ничего об экстраполяции данных из коллекции и их условном применении к правильной геометрии из набора тайлов.


mapbox mapbox-gl-js mapbox-gl
person Greyson    schedule 14.01.2019    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Вы можете сгенерировать выражение из своего списка весов и затем передать его слою, который хотите стилизовать:

const weights = [
    {geoid: 1, weight: 10},
    {geoid: 2, weight: 5},
    {geoid: 3, weight: 30},
];
const cases = weights.map(weight => {
    const condition = ['==', ['get', 'geoid'], weight.geoid];
    const output = getColor(weight.weight);

    return [
        condition,
        output
    ];
});
const expresion = ['case',
    ...cases.reduce((flat, conditionAndOutput) => [...flat, ...conditionAndOutput]),
    '<default-color>'
];

/*
Will result in:
    [
        "case",
        [
        "==",
        [
            "get",
            "geoid"
        ],
        1
        ],
        "rgb(255, 255, 255)",
        [
        "==",
        [
            "get",
            "geoid"
        ],
        2
        ],
        "rgb(255, 255, 255)",
        [
        "==",
        [
            "get",
            "geoid"
        ],
        3
        ],
        "rgb(255, 255, 255)",
        "<default-color>"
    ]
*/
person Scarysize    schedule 15.01.2019