Mapbox:它渲染最后一个点而不是全部

时间:2018-01-26 22:45:48

标签: javascript mapbox mapbox-gl-js

我正在尝试使用Mapbox渲染多个点,但它只显示最后一个。我添加了功能参数,但没有。这应该渲染两个标记,但我不知道它为什么不。我在控制台中没有收到任何错误。

我被困住了,无法找到解决问题的方法。帮助

这是负责积分的代码。:

map.on('load', function() {
    map.loadImage('images/celltower.png', function(error, image) {
        if (error) throw error;
        map.addImage('tower', image);
        map.addLayer({
            "id": "points",
            "type": "symbol",
            "source": {
                "type": "geojson",
                "data": {
                    "type": "FeatureCollection",
                    "features": [{
                        "type": "Feature",
                        "geometry": {
                            "type": "Point",
                            "coordinates": [21.42559803007430, 42.00038270989050]
                        },
                        "geometry": {
                            "type": "Point",
                            "coordinates": [21.38529272846381, 42.0080397578202]
                        }
                    }]
                }
            },
            "layout": {
                "icon-image": "tower",
                "icon-size": 0.25
            }
        });
    });
});

谢谢:)

1 个答案:

答案 0 :(得分:3)

您有一个重复的geometry密钥。从features是一个数组的事实来看,我猜这是正确的方法:

map.on('load', function() {
    map.loadImage('images/celltower.png', function(error, image) {
        if (error) throw error;
        map.addImage('tower', image);
        map.addLayer({
            "id": "points",
            "type": "symbol",
            "source": {
                "type": "geojson",
                "data": {
                    "type": "FeatureCollection",
                    "features": [{
                        "type": "Feature",
                        "geometry": {
                            "type": "Point",
                            "coordinates": [21.42559803007430, 42.00038270989050]
                        }
                    }, {
                        "type": "Feature",
                        "geometry": {
                            "type": "Point",
                            "coordinates": [21.38529272846381, 42.0080397578202]
                        }
                    }]
                }
            },
            "layout": {
                "icon-image": "tower",
                "icon-size": 0.25
            }
        });
    });
});

根据GeoJSON specification,应该有一种指定多个点的方法。 E.g:

"features": [{
    "type": "Feature",
    "geometry": {
        "type": "MultiPoint",
        "coordinates": [
            [21.42559803007430, 42.00038270989050],
            [21.38529272846381, 42.0080397578202]
        ]
    }
}]