OpenLayers 3動態樣式

我需要能夠根據用戶選擇渲染地圖上的樣式。OpenLayers 3動態樣式

目前我加入的風格是這樣的...

style: function (feature, resolution) { 
          var text = resolution * 100000 < 10 ? response.text : ''; 

          if (text != "") { 
           styleCache[text] = [new ol.style.Style({ 
            stroke: new ol.style.Stroke({ 
             color: '#319FD3', 
             width: 1 
            }), 
            text: new ol.style.Text({ 
             font: '12px Calibri,sans-serif', 
             text: text, 
             fill: new ol.style.Fill({ 
              color: '#000' 
             }), 
             stroke: new ol.style.Stroke({ 
              color: '#fff', 
              width: 3 
             }) 
            }), 
            fill: new ol.style.Fill({ 
             color: colorFromDatabase 
            }) 
           })]; 
          } 
          else if (text == "") { 
           styleCache[text] = [new ol.style.Style({ 
            fill: new ol.style.Fill({ 
             color: colorFromDatabase 
            }) 
           }) 
           ] 
          } return styleCache[text]; 
         }

...我需要能夠進入並改變填充，描邊等等......經過渲染，我有有限「成功「......如果這就是你想要的......將所有功能都變成黑色。

任何幫助非常感謝！

來源

2016-09-16 Funn_Bobby

你在使用'ol.interaction.Select'嗎？ –

我是，但不是這個問題...我有地圖上的矢量功能，我從數據庫加載的數據創建風格。我希望用戶能夠在渲染特徵後將顏色，不透明度，線條筆劃更改爲他們想要的任何內容。可以ol.interaction.Select幫助嗎？ –

在這種情況下，您將擁有一個外部控件，您的用戶可以在其中更改這些設置。你能把它放在小提琴裏嗎？ –

感謝@Jonatas沃克在您的幫助，我結束了這個...

var source = webLayer.getSource(); 
               var features = source.getFeatures(); 


               var templateStyle = new ol.style.Style({ 
                fill: new ol.style.Fill({ color: convertHex(Layer.LayerStyle.FillColor, '0.5') }), 
                stroke: new ol.style.Stroke({ color: convertHex(Layer.LayerStyle.LineColor, '0.5') }), 
                text: new ol.style.Text({ 
                 font: '24px Verdana', 
                 text: webLayer.U.label, 
                 offsetY: 20, 
                 fill: new ol.style.Fill({ 
                  color: [255, 255, 255, 0.8] 
                 }) 
                }) 
               }); 


               var select = new ol.interaction.Select({ 
                style: templateStyle 
               }); 

               map.addInteraction(select);             webLayer.setVisible(Visibility); 
               features[0].setStyle(templateStyle);

這是應用樣式！

來源

2016-09-20 16:12:36

OpenLayers 3動態樣式

回答

相關問題