OpenLayers 3中的圖標陰影標記3

是否有任何優雅的方法來添加陰影標記到OpenLayers 3中的圖標循環？我正在努力爲ol3中的圖標添加陰影......並且沒有關於此問題的一致材料。OpenLayers 3中的圖標陰影標記3

2014-12-13 TheLem

我想知道，如果你能簡單使用的圖像（如PNG）的陰影標記，其中的陰影是成功的一半透明。 – pbaldauf 2014-12-13 13:23:59

我有同樣的想法，但它在處理方面並不是最佳的（至少在我的用例中）。所以我正在尋找的是一個「畫布」生成的影子......但我不想亂去，我希望找到一個「優雅」的方式來做到這一點。 – TheLem 2014-12-13 23:31:57

嘗試（例如帶款式）：

var iconStyle = new ol.style.Style({ 
     image: new ol.style.Circle({ 
      radius: 10, 
      snapToPixel: false, 
      fill: new ol.style.Fill({ 
       color: 'rgba(77,135,254,0.4)' 
      }) 
     }), 
     zIndex: 1 
    }); 

    var shadowStyle = new ol.style.Style({ 
     stroke: new ol.style.Stroke({ 
      color: 'rgba(0,0,0,0.5)', 
      width: 6 
     }), 
     zIndex: 0 
    }); 

    iconFeature.setStyle([iconStyle, shadowStyle]);

然後：

 var iconSource = new ol.source.Vector(); // create an empty source 

     var icon = new ol.geom.Point( 
      // your point 
     ); 

     var iconFeature = new ol.Feature({ // create a feature 
      geometry: icon 
     }); 

     iconSource.addFeature(iconFeature); // add the feature to the source 

     var iconLayer = new ol.layer.Vector({ // create a layer with that source 
      source: iconSource 
     }); 
     map.addLayer(iconLayer); // add the layer to the map

來源

2015-10-18 21:20:10 interwebjill

OpenLayers 3中的圖標陰影標記3

回答

相關問題