Question

我试图在地图上显示 GeoJSON 多边形。我使用了OpenLayers提供的示例和以下数据，但只显示了第二个多边形：

var geojsonObject = {
    "type": "FeatureCollection",
    "crs": {
        "type": "name",
    },
    "features": [
        {
            "type": "Feature",
            "geometry": {
                "type": "Polygon",
                "coordinates": [[[103.92240800000013,21.69931],[100.93664,21.66959500000013],[108.031899,18.67076]]]                
            }
        },
        {
            "type": "Feature",
            "geometry": {
                "type": "Polygon",
                "coordinates": [[[-5e6, -1e6], [-4e6, 1e6], [-3e6, -1e6]]]                  
            }
        }
    ]
};

我用于解析 GeoJSON 并将其添加到地图的代码如下：

var vectorSource = new ol.source.Vector({
    features: (new ol.format.GeoJSON()).readFeatures(geojsonObject)
});

var vectorLayer = new ol.layer.Vector({
    source: vectorSource,
    style: styleFunction
});

我注意到了不同种类的坐标。在第二组中，坐标表示为[-5e6, -1e6]与e，我不理解，在第一组中 - 不起作用 - 它们看起来像{{1} }。

这可能是我的多边形没有显示的原因吗？

Answer 1

问题是您使用不同的坐标空间指定了两个多边形，并且需要确定要使用的地图投影。默认情况下，OpenLayers使用他们称之为“球形墨卡托”的东西，而不深入细节，几何坐标由2D平面上的像素表示。

理想情况下，您可以修复GeoJSON以在同一投影中提供所有坐标。如果你不能这样做，这是一个有效的解决方案：

你说的那套不工作看起来像经度和纬度（GIS）坐标，如果它们要显示在同一层上，需要进行转换 - 在下面的例子中我是ve标记了需要使用 GeoJSON properties进行转换的功能，如下所示：

var geojsonObject = {
    type: 'FeatureCollection',
    // ...
    features: [
        {
            type: 'Feature',
            geometry: {
                type: 'Polygon',
                coordinates: [/* ... */],
                properties: {
                    requiresTransform: true  // <- custom property
                }
            }
        },
        // ...
    ]
};

在向图层源添加功能之前，您可以执行以下操作：

var features = (new ol.format.GeoJSON()).readFeatures(geojsonObject);

features.forEach(function(feature){
    if(!feature.get('requiresTransform')) 
        return; // ignore

    var geometry = feature.getGeometry(),
        coords = geometry.getCoordinates();

    if(geometry instanceof ol.geom.Polygon)
        geometry.setCoordinates(transformPolyCoords(coords));
});

function transformPolyCoords(/* Array */ a){
    return a.map(function(aa){
        return aa.map(function(coords){
            return ol.proj.transform(coords, 'EPSG:4326', 'EPSG:3857');  
        });
    });
}

可能有一种更简洁的方法来管理它，我想它会将单独的格式保存在单独的 GeoJSON 对象中，我不知道它与你期望的有多接近，但这就是我使用你提供的内容»working example。

GeoJSON要素坐标不在OpenLayers地图上显示

1 个答案: