2015-10-13 130 views
0

我在地圖上繪製要素(WKT POINTs)。現在我想給出這些點的一個方面。之前我甚至增加功能和層到地圖我做到以下幾點:ol.style.Circle with ol.layer.Vector拋出錯誤

var src = new ol.source.Vector(); 
var layer = new ol.layer.Vector({ 
    source: src, 
    style: new ol.style.Circle({ 
     radius: 30 
    }) 
}); 

這引發以下錯誤:相反,如果我添加相同的風格,以「新ol.layer

AssertionError: Assertion failed: obj geometry must be an ol.style.Style instance 
    at goog.asserts.DEFAULT_ERROR_HANDLER (http://localhost:33464/app/lib/openLayers/ol-debug.js:4330:52) 
    at goog.asserts.doAssertFailure_ (http://localhost:33464/app/lib/openLayers/ol-debug.js:4365:3) 
    at goog.asserts.assertInstanceof (http://localhost:33464/app/lib/openLayers/ol-debug.js:4575:5) 
    at ol.style.createStyleFunction (http://localhost:33464/app/lib/openLayers/ol-debug.js:56402:7) 
    at ol.layer.Vector.prototype.setStyle (http://localhost:33464/app/lib/openLayers/ol-debug.js:58228:3) 
    at ol.layer.Vector (http://localhost:33464/app/lib/openLayers/ol-debug.js:58115:3) 

.Tile」我使用的顯示在後臺的一切OpenStreetMap的(ol.source.OSM)完美的作品:

map = new ol.Map({ 
    target: 'map', 
    layers: [ 
     new ol.layer.Tile({ 
     source: new ol.source.OSM(), 
     style: new ol.style.Circle({ 
      radius: 30 
     }) 
     }) 
    ] 
}); 

我真的不明白。我想這與ol.style.Circle擴展ol.style.Image有關(它聽起來不像是矢量圖層 - 而是柵格圖層「Tile」)。但是,如果我將樣式添加到Tile-Layer,爲什麼vector-Layer上的這些功能會使用此樣式進行渲染?

我的問題:

  1. 什麼是這樣做的正確方法是什麼?

  2. 是否存在「樣式 - 繼承」?

回答

2

style不是ol.layer.Tile對象的有效選擇,因此它被忽略。看到它的文檔:http://openlayers.org/en/v3.10.1/apidoc/ol.layer.Tile.html

ol.layer.Vector定義的樣式定義必須是下面的任一:

  • 一個ol.style.Style對象
  • ol.style.Style對象
  • 樣式功能,即ol.style.StyleFunction的陣列。

所以,爲了您的示例工作,你可以定義一個樣式,看起來像這樣:

var src = new ol.source.Vector(); 
var layer = new ol.layer.Vector({ 
    source: src, 
    style: new ol.style.Style({ 
     image: new ol.style.Circle({ 
      radius: 30, 
      fill: new ol.style.Fill({color: 'red'}) 
     }) 
    }) 
}); 

這個例子演示了自定義樣式:http://openlayers.org/en/v3.10.1/examples/custom-interactions.html

參見API文檔: http://openlayers.org/en/v3.10.1/apidoc/ol.layer.Vector.html

+0

非常感謝 - 我明顯完全誤解了ol.style.Style和ol.style.Circle之間的聯繫(我認爲Circle是一個子類)。我有這樣的印象,它基於http://openlayers.org/workshop/vector/style-intro.html上的「象徵符號」章節(例如,使用Circle代替Style作爲分數) – NoRyb