OL3：ベクターレイヤの既存のスタイルプロパティ（塗りつぶしの色、線の色など）を取得する方法

Question

openlayers 3をベースにしたアプリケーションがあり、マップにベクターレイヤーを追加できるGUIが用意されています。新しいレイヤーが追加されると、レイヤー内にあるフィーチャのジオメトリタイプに基づいてスタイルを提供するためにスタイル関数が呼び出されます。塗りつぶしの色や線の色などのスタイルプロパティでは、ランダムな16進色の値を返す関数を使用します。

レイヤーをマップに追加してレンダリングしたら、これらの16進数のカラー値を取得するにはどうすればよいですか？マップのレイヤーリストパネルで、レイヤーの塗りつぶし色/ストロークカラーを反映する小さなグラフィックスウォッチを提供したいと考えています。ここで

は明確化のためにいくつかのコードの抜粋は以下のとおりです。

は、新たな層のためのintialスタイルの設定：今

URL = window.URL || window.webkitURL; 
    var inputFile = $("#InputFile")[0].files[0]; 
    var path = window.URL.createObjectURL(inputFile); 



    var image = new ol.style.Circle({ 
     radius: 3, 
     fill: new ol.style.Fill({ 
      color: randomColor()/*'rgba(255, 0, 0, 0.8)'*/ 
     }), 
     stroke: new ol.style.Stroke({color: randomColor(), width: 1}) 
    }); 

    var styles = { 
     'Point': [new ol.style.Style({ 
     image: image 
     })], 
     'LineString': [new ol.style.Style({ 
     stroke: new ol.style.Stroke({ 
      color: randomColor(),/*'green',*/ 
      width: 1 
     }) 
     })], 
     'MultiLineString': [new ol.style.Style({ 
     stroke: new ol.style.Stroke({ 
      color: randomColor(),/*'green',*/ 
      width: 1 
     }) 
     })], 
     'MultiPoint': [new ol.style.Style({ 
     image: image 
     })], 
     'MultiPolygon': [new ol.style.Style({ 
     stroke: new ol.style.Stroke({ 
      color: randomColor(),/*'blue',*/ 
      lineDash: [4], 
      width: 3 
     }), 
     fill: new ol.style.Fill({ 
      color: randomColor() 
     }) 
     })], 
     'Polygon': [new ol.style.Style({ 
     stroke: new ol.style.Stroke({ 
      color: randomColor(),/*'blue',*/ 
      lineDash: [4], 
      width: 3 
     }), 
     fill: new ol.style.Fill({ 
      color: randomColor(),/*'rgba(0, 0, 255, 0.1)'*/ 
     }) 
     })], 
     'GeometryCollection': [new ol.style.Style({ 
     stroke: new ol.style.Stroke({ 
      color: randomColor(),/*'magenta',*/ 
      width: 2 
     }), 
     fill: new ol.style.Fill({ 
      color: randomColor()/*'magenta'*/ 
     }), 
     image: new ol.style.Circle({ 
      radius: 10, 
      fill: null, 
      stroke: new ol.style.Stroke({ 
      color: randomColor()/*'magenta'*/ 
      }) 
     }) 
     })], 
     'Circle': [new ol.style.Style({ 
     stroke: new ol.style.Stroke({ 
      color: randomColor(),/*'red',*/ 
      width: 2 
     }), 
     fill: new ol.style.Fill({ 
      color: randomColor()/*'rgba(255,0,0,0.2)'*/ 
     }) 
     })] 
    }; 

    var styleFunction = function(feature, resolution) { 
     return styles[feature.getGeometry().getType()]; 
    }; 



    newLayer = new ol.layer.Vector({ 
     //create a layer 'name' property with the user input 
     name: this.refs.layerName.getValue(),/*$('#layerName').val(),*/ 
     basemap: false, 
     source: new ol.source.Vector({ 
      url: path, 
      format: new ol.format.GeoJSON() 
     }), 
     style: styleFunction 
    }); 

を、層がマップに追加された後、どのように私は、既存のスタイルのプロパティにアクセスすることができます？

map.getLayers().forEach(function(lyr){ 
     if (lyr.get('name') == layerName) { 
      var style = lyr.getStyle();   
          console.log(style); 
     } 
    }) 

lyr.getStyle（）が最初に層をスタイルするために使用された形式の関数を返しますが、私は形式の関数内の実際のプロパティにアクセスするかどうかはわかりません。

Answer 1

それはあなたがあなたはずっとこの方法ではなく...

を取得することはできませんように、最後に、スタイリングはので、多分あなたは異なるアプローチでこれを確認していますになります。

newLayer.getSource().once('addfeature', function(evt){ 
    var style = styles[evt.feature.getGeometry().getType()]; 
}); 

を