OL3：如何获得矢量图层的现有样式属性（例如填充颜色，笔画颜色等）

Question

我有一个基于openlayers 3的应用程序，它提供了一个允许用户将矢量图层添加到地图的GUI。添加新图层时，会调用样式函数以基于图层中找到的要素的几何类型提供样式。对于像填充颜色和笔触颜色这样的样式属性，我使用返回随机十六进制颜色值的函数。

将图层添加到地图并渲染后，如何获取这些十六进制颜色值？在我的地图的图层列表面板中，我希望能够提供反映图层的填充颜色/描边颜色的小图形样本。

这里是澄清一些代码摘录：

设置一个新的层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()]; 
});