Pluggable renderers

This commit is contained in:
Tim Schaub
2017-05-27 17:43:08 -06:00
parent 9bdd643014
commit 9271df7e1d
22 changed files with 487 additions and 111 deletions

View File

@@ -1,8 +1,10 @@
goog.provide('ol.renderer.canvas.ImageLayer');
goog.require('ol');
goog.require('ol.LayerType');
goog.require('ol.ViewHint');
goog.require('ol.extent');
goog.require('ol.renderer.Type');
goog.require('ol.renderer.canvas.IntermediateCanvas');
goog.require('ol.transform');
@@ -11,6 +13,7 @@ goog.require('ol.transform');
* @constructor
* @extends {ol.renderer.canvas.IntermediateCanvas}
* @param {ol.layer.Image} imageLayer Single image layer.
* @api
*/
ol.renderer.canvas.ImageLayer = function(imageLayer) {
@@ -32,6 +35,28 @@ ol.renderer.canvas.ImageLayer = function(imageLayer) {
ol.inherits(ol.renderer.canvas.ImageLayer, ol.renderer.canvas.IntermediateCanvas);
/**
* Determine if this renderer handles the provided layer.
* @param {ol.renderer.Type} type The renderer type.
* @param {ol.layer.Layer} layer The candidate layer.
* @return {boolean} The renderer can render the layer.
*/
ol.renderer.canvas.ImageLayer['handles'] = function(type, layer) {
return type === ol.renderer.Type.CANVAS && layer.getType() === ol.LayerType.IMAGE;
};
/**
* Create a layer renderer.
* @param {ol.renderer.Map} mapRenderer The map renderer.
* @param {ol.layer.Layer} layer The layer to be rendererd.
* @return {ol.renderer.canvas.ImageLayer} The layer renderer.
*/
ol.renderer.canvas.ImageLayer['create'] = function(mapRenderer, layer) {
return new ol.renderer.canvas.ImageLayer(/** @type {ol.layer.Image} */ (layer));
};
/**
* @inheritDoc
*/

View File

@@ -22,6 +22,7 @@ goog.require('ol.source.State');
* @extends {ol.renderer.Map}
* @param {Element} container Container.
* @param {ol.Map} map Map.
* @api
*/
ol.renderer.canvas.Map = function(container, map) {
@@ -61,6 +62,27 @@ ol.renderer.canvas.Map = function(container, map) {
ol.inherits(ol.renderer.canvas.Map, ol.renderer.Map);
/**
* Determine if this renderer handles the provided layer.
* @param {ol.renderer.Type} type The renderer type.
* @return {boolean} The renderer can render the layer.
*/
ol.renderer.canvas.Map['handles'] = function(type) {
return type === ol.renderer.Type.CANVAS;
};
/**
* Create the map renderer.
* @param {Element} container Container.
* @param {ol.Map} map Map.
* @return {ol.renderer.canvas.Map} The map renderer.
*/
ol.renderer.canvas.Map['create'] = function(container, map) {
return new ol.renderer.canvas.Map(container, map);
};
/**
* @param {ol.render.EventType} type Event type.
* @param {olx.FrameState} frameState Frame state.

View File

@@ -3,12 +3,14 @@
goog.provide('ol.renderer.canvas.TileLayer');
goog.require('ol');
goog.require('ol.LayerType');
goog.require('ol.TileRange');
goog.require('ol.TileState');
goog.require('ol.ViewHint');
goog.require('ol.array');
goog.require('ol.dom');
goog.require('ol.extent');
goog.require('ol.renderer.Type');
goog.require('ol.renderer.canvas.IntermediateCanvas');
goog.require('ol.transform');
@@ -17,6 +19,7 @@ goog.require('ol.transform');
* @constructor
* @extends {ol.renderer.canvas.IntermediateCanvas}
* @param {ol.layer.Tile|ol.layer.VectorTile} tileLayer Tile layer.
* @api
*/
ol.renderer.canvas.TileLayer = function(tileLayer) {
@@ -80,6 +83,28 @@ ol.renderer.canvas.TileLayer = function(tileLayer) {
ol.inherits(ol.renderer.canvas.TileLayer, ol.renderer.canvas.IntermediateCanvas);
/**
* Determine if this renderer handles the provided layer.
* @param {ol.renderer.Type} type The renderer type.
* @param {ol.layer.Layer} layer The candidate layer.
* @return {boolean} The renderer can render the layer.
*/
ol.renderer.canvas.TileLayer['handles'] = function(type, layer) {
return type === ol.renderer.Type.CANVAS && layer.getType() === ol.LayerType.TILE;
};
/**
* Create a layer renderer.
* @param {ol.renderer.Map} mapRenderer The map renderer.
* @param {ol.layer.Layer} layer The layer to be rendererd.
* @return {ol.renderer.canvas.TileLayer} The layer renderer.
*/
ol.renderer.canvas.TileLayer['create'] = function(mapRenderer, layer) {
return new ol.renderer.canvas.TileLayer(/** @type {ol.layer.Tile} */ (layer));
};
/**
* @private
* @param {ol.Tile} tile Tile.

View File

@@ -1,12 +1,14 @@
goog.provide('ol.renderer.canvas.VectorLayer');
goog.require('ol');
goog.require('ol.LayerType');
goog.require('ol.ViewHint');
goog.require('ol.dom');
goog.require('ol.extent');
goog.require('ol.render.EventType');
goog.require('ol.render.canvas');
goog.require('ol.render.canvas.ReplayGroup');
goog.require('ol.renderer.Type');
goog.require('ol.renderer.canvas.Layer');
goog.require('ol.renderer.vector');
@@ -15,6 +17,7 @@ goog.require('ol.renderer.vector');
* @constructor
* @extends {ol.renderer.canvas.Layer}
* @param {ol.layer.Vector} vectorLayer Vector layer.
* @api
*/
ol.renderer.canvas.VectorLayer = function(vectorLayer) {
@@ -66,6 +69,28 @@ ol.renderer.canvas.VectorLayer = function(vectorLayer) {
ol.inherits(ol.renderer.canvas.VectorLayer, ol.renderer.canvas.Layer);
/**
* Determine if this renderer handles the provided layer.
* @param {ol.renderer.Type} type The renderer type.
* @param {ol.layer.Layer} layer The candidate layer.
* @return {boolean} The renderer can render the layer.
*/
ol.renderer.canvas.VectorLayer['handles'] = function(type, layer) {
return type === ol.renderer.Type.CANVAS && layer.getType() === ol.LayerType.VECTOR;
};
/**
* Create a layer renderer.
* @param {ol.renderer.Map} mapRenderer The map renderer.
* @param {ol.layer.Layer} layer The layer to be rendererd.
* @return {ol.renderer.canvas.VectorLayer} The layer renderer.
*/
ol.renderer.canvas.VectorLayer['create'] = function(mapRenderer, layer) {
return new ol.renderer.canvas.VectorLayer(/** @type {ol.layer.Vector} */ (layer));
};
/**
* @inheritDoc
*/

View File

@@ -1,16 +1,18 @@
goog.provide('ol.renderer.canvas.VectorTileLayer');
goog.require('ol');
goog.require('ol.LayerType');
goog.require('ol.TileState');
goog.require('ol.dom');
goog.require('ol.extent');
goog.require('ol.layer.VectorTileRenderType');
goog.require('ol.proj');
goog.require('ol.proj.Units');
goog.require('ol.layer.VectorTileRenderType');
goog.require('ol.render.ReplayType');
goog.require('ol.render.canvas');
goog.require('ol.render.canvas.ReplayGroup');
goog.require('ol.render.replay');
goog.require('ol.renderer.Type');
goog.require('ol.renderer.canvas.TileLayer');
goog.require('ol.renderer.vector');
goog.require('ol.size');
@@ -21,6 +23,7 @@ goog.require('ol.transform');
* @constructor
* @extends {ol.renderer.canvas.TileLayer}
* @param {ol.layer.VectorTile} layer VectorTile layer.
* @api
*/
ol.renderer.canvas.VectorTileLayer = function(layer) {
@@ -57,6 +60,28 @@ ol.renderer.canvas.VectorTileLayer = function(layer) {
ol.inherits(ol.renderer.canvas.VectorTileLayer, ol.renderer.canvas.TileLayer);
/**
* Determine if this renderer handles the provided layer.
* @param {ol.renderer.Type} type The renderer type.
* @param {ol.layer.Layer} layer The candidate layer.
* @return {boolean} The renderer can render the layer.
*/
ol.renderer.canvas.VectorTileLayer['handles'] = function(type, layer) {
return type === ol.renderer.Type.CANVAS && layer.getType() === ol.LayerType.VECTOR_TILE;
};
/**
* Create a layer renderer.
* @param {ol.renderer.Map} mapRenderer The map renderer.
* @param {ol.layer.Layer} layer The layer to be rendererd.
* @return {ol.renderer.canvas.VectorTileLayer} The layer renderer.
*/
ol.renderer.canvas.VectorTileLayer['create'] = function(mapRenderer, layer) {
return new ol.renderer.canvas.VectorTileLayer(/** @type {ol.layer.VectorTile} */ (layer));
};
/**
* @const
* @type {!Object.<string, Array.<ol.render.ReplayType>>}

View File

@@ -7,6 +7,7 @@ goog.require('ol.events.EventType');
goog.require('ol.extent');
goog.require('ol.functions');
goog.require('ol.layer.Layer');
goog.require('ol.plugins');
goog.require('ol.style');
goog.require('ol.transform');
@@ -206,12 +207,24 @@ ol.renderer.Map.prototype.getLayerRenderer = function(layer) {
if (layerKey in this.layerRenderers_) {
return this.layerRenderers_[layerKey];
} else {
var layerRenderer = layer.createRenderer(this);
this.layerRenderers_[layerKey] = layerRenderer;
this.layerRendererListeners_[layerKey] = ol.events.listen(layerRenderer,
ol.events.EventType.CHANGE, this.handleLayerRendererChange_, this);
return layerRenderer;
var layerRendererPlugins = ol.plugins.getLayerRendererPlugins();
var renderer;
var type = this.getType();
for (var i = 0, ii = layerRendererPlugins.length; i < ii; ++i) {
var plugin = layerRendererPlugins[i];
if (plugin.handles(type, layer)) {
renderer = plugin.create(this, layer);
break;
}
}
if (renderer) {
this.layerRenderers_[layerKey] = renderer;
this.layerRendererListeners_[layerKey] = ol.events.listen(renderer,
ol.events.EventType.CHANGE, this.handleLayerRendererChange_, this);
} else {
throw new Error('Unable to create renderer for layer: ' + layer.getType());
}
return renderer;
}
};
@@ -245,7 +258,7 @@ ol.renderer.Map.prototype.getMap = function() {
/**
* @abstract
* @return {string} Type
* @return {ol.renderer.Type} Type
*/
ol.renderer.Map.prototype.getType = function() {};

View File

@@ -1,10 +1,12 @@
goog.provide('ol.renderer.webgl.ImageLayer');
goog.require('ol');
goog.require('ol.LayerType');
goog.require('ol.ViewHint');
goog.require('ol.dom');
goog.require('ol.extent');
goog.require('ol.functions');
goog.require('ol.renderer.Type');
goog.require('ol.renderer.webgl.Layer');
goog.require('ol.source.ImageVector');
goog.require('ol.transform');
@@ -19,6 +21,7 @@ if (ol.ENABLE_WEBGL) {
* @extends {ol.renderer.webgl.Layer}
* @param {ol.renderer.webgl.Map} mapRenderer Map renderer.
* @param {ol.layer.Image} imageLayer Tile layer.
* @api
*/
ol.renderer.webgl.ImageLayer = function(mapRenderer, imageLayer) {
@@ -47,6 +50,31 @@ if (ol.ENABLE_WEBGL) {
ol.inherits(ol.renderer.webgl.ImageLayer, ol.renderer.webgl.Layer);
/**
* Determine if this renderer handles the provided layer.
* @param {ol.renderer.Type} type The renderer type.
* @param {ol.layer.Layer} layer The candidate layer.
* @return {boolean} The renderer can render the layer.
*/
ol.renderer.webgl.ImageLayer['handles'] = function(type, layer) {
return type === ol.renderer.Type.WEBGL && layer.getType() === ol.LayerType.IMAGE;
};
/**
* Create a layer renderer.
* @param {ol.renderer.Map} mapRenderer The map renderer.
* @param {ol.layer.Layer} layer The layer to be rendererd.
* @return {ol.renderer.webgl.ImageLayer} The layer renderer.
*/
ol.renderer.webgl.ImageLayer['create'] = function(mapRenderer, layer) {
return new ol.renderer.webgl.ImageLayer(
/** @type {ol.renderer.webgl.Map} */ (mapRenderer),
/** @type {ol.layer.Image} */ (layer)
);
};
/**
* @param {ol.ImageBase} image Image.
* @private

View File

@@ -28,6 +28,7 @@ if (ol.ENABLE_WEBGL) {
* @extends {ol.renderer.Map}
* @param {Element} container Container.
* @param {ol.Map} map Map.
* @api
*/
ol.renderer.webgl.Map = function(container, map) {
ol.renderer.Map.call(this, container, map);
@@ -162,6 +163,27 @@ if (ol.ENABLE_WEBGL) {
ol.inherits(ol.renderer.webgl.Map, ol.renderer.Map);
/**
* Determine if this renderer handles the provided layer.
* @param {ol.renderer.Type} type The renderer type.
* @return {boolean} The renderer can render the layer.
*/
ol.renderer.webgl.Map['handles'] = function(type) {
return type === ol.renderer.Type.WEBGL;
};
/**
* Create the map renderer.
* @param {Element} container Container.
* @param {ol.Map} map Map.
* @return {ol.renderer.webgl.Map} The map renderer.
*/
ol.renderer.webgl.Map['create'] = function(container, map) {
return new ol.renderer.webgl.Map(container, map);
};
/**
* @param {ol.Tile} tile Tile.
* @param {ol.Size} tileSize Tile size.

View File

@@ -4,11 +4,13 @@
goog.provide('ol.renderer.webgl.TileLayer');
goog.require('ol');
goog.require('ol.TileState');
goog.require('ol.LayerType');
goog.require('ol.TileRange');
goog.require('ol.TileState');
goog.require('ol.array');
goog.require('ol.extent');
goog.require('ol.math');
goog.require('ol.renderer.Type');
goog.require('ol.renderer.webgl.Layer');
goog.require('ol.renderer.webgl.tilelayershader');
goog.require('ol.size');
@@ -24,6 +26,7 @@ if (ol.ENABLE_WEBGL) {
* @extends {ol.renderer.webgl.Layer}
* @param {ol.renderer.webgl.Map} mapRenderer Map renderer.
* @param {ol.layer.Tile} tileLayer Tile layer.
* @api
*/
ol.renderer.webgl.TileLayer = function(mapRenderer, tileLayer) {
@@ -86,6 +89,31 @@ if (ol.ENABLE_WEBGL) {
ol.inherits(ol.renderer.webgl.TileLayer, ol.renderer.webgl.Layer);
/**
* Determine if this renderer handles the provided layer.
* @param {ol.renderer.Type} type The renderer type.
* @param {ol.layer.Layer} layer The candidate layer.
* @return {boolean} The renderer can render the layer.
*/
ol.renderer.webgl.TileLayer['handles'] = function(type, layer) {
return type === ol.renderer.Type.WEBGL && layer.getType() === ol.LayerType.TILE;
};
/**
* Create a layer renderer.
* @param {ol.renderer.Map} mapRenderer The map renderer.
* @param {ol.layer.Layer} layer The layer to be rendererd.
* @return {ol.renderer.webgl.TileLayer} The layer renderer.
*/
ol.renderer.webgl.TileLayer['create'] = function(mapRenderer, layer) {
return new ol.renderer.webgl.TileLayer(
/** @type {ol.renderer.webgl.Map} */ (mapRenderer),
/** @type {ol.layer.Tile} */ (layer)
);
};
/**
* @inheritDoc
*/

View File

@@ -1,9 +1,11 @@
goog.provide('ol.renderer.webgl.VectorLayer');
goog.require('ol');
goog.require('ol.LayerType');
goog.require('ol.ViewHint');
goog.require('ol.extent');
goog.require('ol.render.webgl.ReplayGroup');
goog.require('ol.renderer.Type');
goog.require('ol.renderer.vector');
goog.require('ol.renderer.webgl.Layer');
goog.require('ol.transform');
@@ -16,6 +18,7 @@ if (ol.ENABLE_WEBGL) {
* @extends {ol.renderer.webgl.Layer}
* @param {ol.renderer.webgl.Map} mapRenderer Map renderer.
* @param {ol.layer.Vector} vectorLayer Vector layer.
* @api
*/
ol.renderer.webgl.VectorLayer = function(mapRenderer, vectorLayer) {
@@ -68,6 +71,31 @@ if (ol.ENABLE_WEBGL) {
ol.inherits(ol.renderer.webgl.VectorLayer, ol.renderer.webgl.Layer);
/**
* Determine if this renderer handles the provided layer.
* @param {ol.renderer.Type} type The renderer type.
* @param {ol.layer.Layer} layer The candidate layer.
* @return {boolean} The renderer can render the layer.
*/
ol.renderer.webgl.VectorLayer['handles'] = function(type, layer) {
return type === ol.renderer.Type.WEBGL && layer.getType() === ol.LayerType.VECTOR;
};
/**
* Create a layer renderer.
* @param {ol.renderer.Map} mapRenderer The map renderer.
* @param {ol.layer.Layer} layer The layer to be rendererd.
* @return {ol.renderer.webgl.VectorLayer} The layer renderer.
*/
ol.renderer.webgl.VectorLayer['create'] = function(mapRenderer, layer) {
return new ol.renderer.webgl.VectorLayer(
/** @type {ol.renderer.webgl.Map} */ (mapRenderer),
/** @type {ol.layer.Vector} */ (layer)
);
};
/**
* @inheritDoc
*/