Mapbox 图层具有重复 ID

Question

我正在使用 Mapbox-GL-JS 构建一个 Web 应用程序，它使用 mapbox studio 瓦片集将图层添加为 choropleths。但是，当我访问该图层时，多个功能似乎正在接收相同的 ID。

https://github.com/mapbox/mapbox-gl-js/issues/8284 这里提到这是由于我的数据，但是数据集中没有 ID 字段： https://www.dropbox.com/s/5ci0hosqakvdahx/townships.json?dl=0

https://jsbin.com/cuhewomepo/1/edit?html,js,output

map.on("mousemove", "gemeentes", function (e) {
    if (e.features.length > 0) {
        if (hoverGemeenteId) {
            map.setFeatureState({
                source: 'gemeentes-src',
                sourceLayer: 'townships-0u4ffk',
                id: hoverGemeenteId
            }, {hover: false});
        }
        hoverGemeenteId = e.features[0].id;
        console.log(hoverGemeenteId);
        map.setFeatureState({
            source: 'gemeentes-src',
            sourceLayer: 'townships-0u4ffk',
            id: hoverGemeenteId
        }, {hover: true});
    }
});

以下是项目示例： https://docs.mapbox.com/mapbox-gl-js/example/hover-styles/

当一个乡镇被悬停时，它会改变颜色，但是由于有多个具有相同 ID 的乡镇，多个区域会亮起，而不仅仅是被悬停的那个。

编辑： 当我运行以下代码时：

const filtered = map.querySourceFeatures('gemeentes-src', {
        sourceLayer: 'townships-0u4ffk',
        filter: ['>=', ['id'], 0]
    });

它清楚地表明有多个具有相同 id 的特征，并且没有一个 ID 超过 249。这几乎就像有一个 250 的上限，而新特征又从 0 开始。

Answer 1

添加源时，您可以使用选项promoteId 根据属性为要素分配唯一 ID。

https://docs.mapbox.com/mapbox-gl-js/style-spec/sources/#vector-promoteId

例如（from the PR that added this feature to MapboxGL）：

map.addSource('counties', {
    "type": "vector",
    "url": "mapbox://mapbox.82pkq93d",
    "promoteId": {"original": "COUNTY"}
});
...
map.setFeatureState({
    source: 'counties', 
    sourceLayer: 'original', 
    id: 'Marin County' // reference a feature by a county name for feature-state
}, {hover: true});