向量出口後再次繪製圓

畫在我的地圖了一圈後，我與它導出：向量出口後再次繪製圓

getAsJson : function() { 
    var geojson = new ol.format.GeoJSON(); 
    var features = this.vectorSource.getFeatures(); 

    var jsonData = geojson.writeFeatures(features,{ 
     featureProjection: ol.proj.get('EPSG:3857'), 
     dataProjection: ol.proj.get('EPSG:4326') 
    }); 

    return jsonData; 
}

，結果是：

{"type":"FeatureCollection","features":[ 
    {"type":"Feature","geometry":{ 
     "type":"GeometryCollection","geometries":[] 
    },"properties":{ 
     "circleCenter":[-4805776.093508227,-2600749.7153150304],"circleRadius":6658.801529937424 
    } 
}]}

我這是怎麼走圓心和半徑：

var draw = new ol.interaction.Draw({ 
     source: vectorSource, 
     type: value, // Can be Circle,Point,Line,Polygon 
     // No Geometry Function when type is 'Circle' (omited code to simplify) 
     geometryFunction: geometryFunction, 
     maxPoints: maxPoints 
    }); 


    draw.on('drawend', function(evt){ 
     var geometry = evt.feature.getGeometry(); 
     // Check the type before try to get this! (omited code to simplify) 
     var center = geometry.getCenter(); 
     var radius = geometry.getRadius(); 
     evt.feature.set('circleCenter', center); 
     evt.feature.set('circleRadius', radius); 
    }); 

    map.addInteraction(draw);

現在我試圖用這個JSON再次繪製相同的圓，但它沒有幾何，這是不是工作（對於所有其他幾何形狀像點，polygong和線工作，所以這個問題是不是代碼）：

var features = new ol.format.GeoJSON().readFeatures(jsonData, { 
    featureProjection: 'EPSG:3857' 
});   

var vectorSource = new ol.source.Vector({ 
}); 

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

map.addLayer(vectorLayer);

剛一說明：我可以看到現在圓心和半徑的投影沒有改變。必須在此工作...

來源

2017-02-09 Magno C

GeoJSON不支持圓幾何。所以ol.format.GeoJSON()格式不會將JSON轉換爲ol.Feature對象。因此，編寫一個消費JSON數據並創建圓形幾何的自定義方法。

var featuresJson = geoJson.features; 

for (var i=0; i<featuresJson.length; i++) { 
    var radius = featuresJson[i].properties.circleRadius; 
    var center = featuresJson[i].properties.circleCenter; 

    var feature = new ol.Feature(new ol.geom.Circle(center,radius); 
    vectorSource.addFeature(feature); 
}

來源

2017-02-09 17:42:04

工作。謝謝。只是一個註釋：我失去了所有屬性，因爲新功能，所以我需要將屬性從'featuresJson [i]'傳遞給'feature'，但是我必須保留新的幾何：'var oldProperties = featuresJson [i]。的GetProperties（）; var newProperties = feature.getProperties（）; oldProperties.geometry = newProperties.geometry; feature.setProperties（oldProperties，true）;' –

我認爲這可以幫助我以某種方式...將看到。

map.getViewport().addEventListener("dblclick", function(e) { 
    var coordinate = map.getEventCoordinate(e); 
    vectorSource.addFeature(new ol.Feature(new ol.geom.Circle(coordinate, dist))); 
});

來源

2017-02-09 13:16:56

向量出口後再次繪製圓

回答

相關問題