OpenLayers haritaında görüntülenmeyen GeoJSON özellik koordinatları

Question

Haritaya GeoJSON çokgen göstermeye çalışıyorum. Aşağıdaki verilerle openlayers tarafından sağlanan örnek kullandım, fakat sadece ikinci çokgen görüntülenir:

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]]]     
      } 
     } 
    ] 
}; 

Ben haritası gibidir üzere GeoJSON'a ayrıştırmak ve eklemek için kullanıyorum kod aşağıdakiler:

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

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

Farklı türde koordinatlar fark ettim. İkinci sette, koordinatlar, anlamadığım ve ilk sette e ile [-5e6, -1e6] olarak temsil edilir - bu işe yaramaz - [103.92240800000013, 21.69931] gibi görünürler.

Bu, poligonumun görüntülenmemesinin olası bir sebebi mi?

Answer 1

Sorun, iki çokgeninizin farklı koordinat alanları kullanılarak belirtilmesidir ve hangi harita projeksiyonunu kullanacağınızı belirlemeniz gerekir. Varsayılan olarak OpenLayers, "küresel mercator" olarak adlandırdıkları bir şeyi kullanır ve detaylara bakmadan geometri koordinatları bir 2B düzlemindeki piksellerle temsil edilir.

İdeal olarak, GeoJSON'unuzu, aynı projeksiyonda tüm koordinatları sağlamak için düzeltirdiniz. Bunu yapamıyorsanız, burada bir çalışma çözümdür:

enlem ve boylam (CBS) gibi göz çalışmıyor demek seti koordinatları ve görüntülenecek ise dönüştürülmüş olması gerekir aynı tabaka - Öyle gibi GeoJSON'aproperties kullanarak dönüşümü gerektiren özelliklere etiketlediniz aşağıdaki örnekte:

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

sonra aşağıdaki gibi bir şey yapabileceğini katman kaynağına özellikler eklemeden önce :

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'); 
     }); 
    }); 
} 

bu yönetmenin daha temiz bir yolu olabilir ve bunu ayrı GeoJSON nesneleri ayrı biçimlerini sağlamayı içerir hayal ediyorum ve bunu beklediğin ne kadar yakın olduğunu bilmiyorum ama bu » working example'u sağladığın şeyi kullanarak geldim.