Блог

Я смущен тем, насколько элементарной кажется эта проблема, но, похоже, я не могу понять, как просто добавить полигональный объект GeoJSON в векторный источник.

Я использую OpenLayers 5, и до сих пор я создавал отдельный источник и слой для каждого объекта, который я добавляю на карту. Причина в том, что мне нужно было иметь возможность включать и выключать видимость отдельных полигонов, и в то время это казалось лучшим способом сделать это. Сначала это сработало, но я уверен, что это не лучшая практика — по сути, я создаю 200 слоев и 200 источников для 200 полигонов. Я бы предпочел создавать один слой, который использует один источник, содержащий эти 200 полигонов.

Это то, что у меня сейчас есть:

 window["srcCells"] = new ol.source.Vector({});
window["ftr1"] = new ol.Feature({
    geometry: new ol.geom.Polygon({ // <--- this is where I'm getting an error
        coordinates: geometry.coordinates[0]
    })
});
window["srcCells"].addFeature(window["ftr1"]);
window["lyrCells"] = new ol.layer.Vector({
    name: "lyrCells",
    source: window["srcCells"],
    visible: true,
    style: new ol.style.Style({
        stroke: new ol.style.Stroke({
        color: 'rgba(255, 255, 255, 1)',
        width: 0.5
    }),
    fill: new ol.style.Fill({
        color: 'rgba(255, 255, 255, 0)'
    }),
    text: new ol.style.Text({
        font: '11px Roboto',
        overflow: false,
        fill: new ol.style.Fill({
            color: '#fff'
        }),
        stroke: new ol.style.Stroke({
            color: '#333',
            width: 2
        })
    })
    })
});
map.addLayer(window["lyrCells"]);
  

console.dir(geometry.coordinates[0]); дает следующее:

 0: (3) [140.9528856796365, -37.00284635019008, 111.304]
1: (3) [140.9536707180603, -37.00304972058393, 113.03]
2: (3) [140.9537622719694, -37.00307250872015, 110.607]
3: (3) [140.95383548835147, -37.003105295678026, 110.64]
4: (3) [140.95393795398604, -37.003149857783384, 110.26276070403628]
5: (3) [140.95586925648476, -37.00401679761869, 111.192]
6: (3) [140.95644098404094, -37.00388629902322, 110.38710718081241]
7: (3) [140.95644582710668, -37.0051300157363, 111.17174176388276]
8: (3) [140.9528945167084, -37.00514320603378, 110.9445749409575]
9: (3) [140.95289318042316, -37.004769323489825, 113.688]
  

В третьей строке приведенного выше кода (где я указал) я получаю эту ошибку:

 SimpleGeometry.js:187 Uncaught TypeError: Cannot read property 'length' of undefined
    at e.setLayout (SimpleGeometry.js:187)
    at e.setCoordinates (Polygon.js:313)
    at new e (Polygon.js:80)
  

geometry.coordinates[0] похоже на открытую строку. Чтобы использовать его как полигон, вам нужно будет замкнуть кольцо и, поскольку полигон представляет собой массив линейных колец, заключить с [] помощью . Кроме того, координаты являются первым параметром конструктора, а не опцией:

 geometry: new ol.geom.Polygon(
     [ geometry.coordinates[0].concat([geometry.coordinates[0][0]]) ]
)
  

В качестве альтернативы вам может потребоваться проверить, что ваши данные являются полигональными или линейными, и использовать new ol.geom.LineString , где это уместно