diff --git a/examples/icon-sprite-webgl.js b/examples/icon-sprite-webgl.js index 5e08ae49e5..d6305178d7 100644 --- a/examples/icon-sprite-webgl.js +++ b/examples/icon-sprite-webgl.js @@ -1,5 +1,5 @@ import Feature from '../src/ol/Feature.js'; -import Map from '../src/ol/Map.js'; +import Map from '../src/ol/WebGLMap.js'; import View from '../src/ol/View.js'; import Point from '../src/ol/geom/Point.js'; import VectorLayer from '../src/ol/layer/Vector.js'; @@ -80,7 +80,6 @@ const vector = new VectorLayer({ }); const map = new Map({ - renderer: /** @type {Array} */ (['webgl', 'canvas']), layers: [vector], target: document.getElementById('map'), view: new View({ diff --git a/examples/layer-clipping-webgl.js b/examples/layer-clipping-webgl.js index a2c6e7f1db..63adfc1f4f 100644 --- a/examples/layer-clipping-webgl.js +++ b/examples/layer-clipping-webgl.js @@ -1,4 +1,4 @@ -import Map from '../src/ol/Map.js'; +import Map from '../src/ol/WebGLMap.js'; import View from '../src/ol/View.js'; import {defaults as defaultControls} from '../src/ol/control.js'; import {WEBGL} from '../src/ol/has.js'; @@ -19,7 +19,6 @@ if (!WEBGL) { const map = new Map({ layers: [osm], - renderer: /** @type {Array} */ (['webgl', 'canvas']), target: 'map', controls: defaultControls({ attributionOptions: { diff --git a/examples/side-by-side.html b/examples/side-by-side.html index 557751535f..7f57354f77 100644 --- a/examples/side-by-side.html +++ b/examples/side-by-side.html @@ -13,7 +13,4 @@ tags: "side-by-side, canvas, webgl"

WebGL

-
diff --git a/examples/side-by-side.js b/examples/side-by-side.js index 11022381d9..121ba51a0e 100644 --- a/examples/side-by-side.js +++ b/examples/side-by-side.js @@ -1,6 +1,6 @@ import Map from '../src/ol/Map.js'; +import WebGLMap from '../src/ol/WebGLMap.js'; import View from '../src/ol/View.js'; -import {WEBGL} from '../src/ol/has.js'; import TileLayer from '../src/ol/layer/Tile.js'; import OSM from '../src/ol/source/OSM.js'; @@ -19,17 +19,8 @@ const map1 = new Map({ view: view }); -if (WEBGL) { - const map2 = new Map({ - target: 'webglMap', - renderer: /** @type {Array} */ (['webgl', 'canvas']), - layers: [layer], - view: view - }); -} else { - const info = document.getElementById('no-webgl'); - /** - * display error message - */ - info.style.display = ''; -} +const map2 = new WebGLMap({ + target: 'webglMap', + layers: [layer], + view: view +}); diff --git a/examples/symbol-atlas-webgl.js b/examples/symbol-atlas-webgl.js index 74f86d1302..9256fcf399 100644 --- a/examples/symbol-atlas-webgl.js +++ b/examples/symbol-atlas-webgl.js @@ -1,5 +1,5 @@ import Feature from '../src/ol/Feature.js'; -import Map from '../src/ol/Map.js'; +import Map from '../src/ol/WebGLMap.js'; import View from '../src/ol/View.js'; import Point from '../src/ol/geom/Point.js'; import VectorLayer from '../src/ol/layer/Vector.js'; @@ -107,7 +107,6 @@ const vector = new VectorLayer({ }); const map = new Map({ - renderer: /** @type {Array} */ (['webgl', 'canvas']), layers: [vector], target: document.getElementById('map'), view: new View({ diff --git a/src/ol/Map.js b/src/ol/Map.js index ff4360641a..fd1d3ec049 100644 --- a/src/ol/Map.js +++ b/src/ol/Map.js @@ -3,24 +3,15 @@ */ import {inherits} from './index.js'; import PluggableMap from './PluggableMap.js'; -import PluginType from './PluginType.js'; import {defaults as defaultControls} from './control.js'; import {defaults as defaultInteractions} from './interaction.js'; import {assign} from './obj.js'; -import {registerMultiple} from './plugins.js'; import CanvasImageLayerRenderer from './renderer/canvas/ImageLayer.js'; import CanvasMapRenderer from './renderer/canvas/Map.js'; import CanvasTileLayerRenderer from './renderer/canvas/TileLayer.js'; import CanvasVectorLayerRenderer from './renderer/canvas/VectorLayer.js'; import CanvasVectorTileLayerRenderer from './renderer/canvas/VectorTileLayer.js'; -registerMultiple(PluginType.LAYER_RENDERER, [ - CanvasImageLayerRenderer, - CanvasTileLayerRenderer, - CanvasVectorLayerRenderer, - CanvasVectorTileLayerRenderer -]); - /** * @classdesc * The map is the core component of OpenLayers. For a map to render, a view, @@ -90,7 +81,14 @@ const Map = function(options) { inherits(Map, PluggableMap); Map.prototype.createRenderer = function() { - return new CanvasMapRenderer(this); + const renderer = new CanvasMapRenderer(this); + renderer.registerLayerRenderers([ + CanvasImageLayerRenderer, + CanvasTileLayerRenderer, + CanvasVectorLayerRenderer, + CanvasVectorTileLayerRenderer + ]); + return renderer; }; export default Map; diff --git a/src/ol/PluginType.js b/src/ol/PluginType.js deleted file mode 100644 index 18f0cd95e4..0000000000 --- a/src/ol/PluginType.js +++ /dev/null @@ -1,11 +0,0 @@ -/** - * @module ol/PluginType - */ - -/** - * A plugin type used when registering a plugin. - * @enum {string} - */ -export default { - LAYER_RENDERER: 'LAYER_RENDERER' -}; diff --git a/src/ol/WebGLMap.js b/src/ol/WebGLMap.js index d0f4f32a42..1da33acb01 100644 --- a/src/ol/WebGLMap.js +++ b/src/ol/WebGLMap.js @@ -3,24 +3,15 @@ */ import {inherits} from './index.js'; import PluggableMap from './PluggableMap.js'; -import PluginType from './PluginType.js'; import {defaults as defaultControls} from './control.js'; import {defaults as defaultInteractions} from './interaction.js'; import {assign} from './obj.js'; -import {registerMultiple} from './plugins.js'; import WebGLImageLayerRenderer from './renderer/webgl/ImageLayer.js'; import WebGLMapRenderer from './renderer/webgl/Map.js'; import WebGLTileLayerRenderer from './renderer/webgl/TileLayer.js'; import WebGLVectorLayerRenderer from './renderer/webgl/VectorLayer.js'; -registerMultiple(PluginType.LAYER_RENDERER, [ - WebGLImageLayerRenderer, - WebGLTileLayerRenderer, - WebGLVectorLayerRenderer -]); - - /** * @classdesc * The WebGLMap uses WebGL for rendering map layers. This renderer has limited @@ -91,7 +82,13 @@ inherits(WebGLMap, PluggableMap); WebGLMap.prototype.createRenderer = function() { - return new WebGLMapRenderer(this); + const renderer = new WebGLMapRenderer(this); + renderer.registerLayerRenderers([ + WebGLImageLayerRenderer, + WebGLTileLayerRenderer, + WebGLVectorLayerRenderer + ]); + return renderer; }; export default WebGLMap; diff --git a/src/ol/plugins.js b/src/ol/plugins.js deleted file mode 100644 index 288bec1db2..0000000000 --- a/src/ol/plugins.js +++ /dev/null @@ -1,71 +0,0 @@ -/** - * @module ol/plugins - */ -import PluginType from './PluginType.js'; - - -/** - * @typedef {Object} MapRendererPlugin - * @property {function(module:ol/renderer/Type):boolean} handles Determine if - * this renderer handles the provided layer. - * @property {function(Element, module:ol/PluggableMap~PluggableMap):module:ol/renderer/Map~Map} create - * Create the map renderer. - */ - - -/** - * @typedef {Object} LayerRendererPlugin - * @property {function(module:ol/renderer/Type, module:ol/layer/Layer~Layer):boolean} handles - * Determine if this renderer handles the provided layer. - * @property {function(module:ol/renderer/Map~Map, module:ol/layer/Layer~Layer):module:ol/renderer/Layer~Layer} create - * Create a layer renderer. - */ - - -/** - * The registry of layer renderer plugins. - * @type {Array} - * @private - */ -const layerRendererPlugins = []; - - -/** - * Get all registered layer renderer plugins. - * @return {Array} The registered layer renderer plugins. - */ -export function getLayerRendererPlugins() { - return layerRendererPlugins; -} - - -/** - * Register a plugin. - * @param {module:ol/PluginType~PluginType} type The plugin type. - * @param {*} plugin The plugin. - */ -export function register(type, plugin) { - let plugins; - switch (type) { - case PluginType.LAYER_RENDERER: { - plugins = layerRendererPlugins; - plugins.push(/** @type {olx.LayerRendererPlugin} */ (plugin)); - break; - } - default: { - throw new Error('Unsupported plugin type: ' + type); - } - } -} - - -/** - * Register multiple plugins. - * @param {module:ol/PluginType~PluginType} type The plugin type. - * @param {Array} plugins The plugins. - */ -export function registerMultiple(type, plugins) { - for (let i = 0, ii = plugins.length; i < ii; ++i) { - register(type, plugins[i]); - } -} diff --git a/src/ol/renderer/Map.js b/src/ol/renderer/Map.js index e740322635..81aad4f077 100644 --- a/src/ol/renderer/Map.js +++ b/src/ol/renderer/Map.js @@ -8,7 +8,6 @@ import EventType from '../events/EventType.js'; import {getWidth} from '../extent.js'; import {TRUE, UNDEFINED} from '../functions.js'; import {visibleAtResolution} from '../layer/Layer.js'; -import {getLayerRendererPlugins} from '../plugins.js'; import {iconImageCache} from '../style.js'; import {compose as composeTransform, invert as invertTransform, setFromArray as transformSetFromArray} from '../transform.js'; @@ -40,11 +39,35 @@ const MapRenderer = function(map) { */ this.layerRendererListeners_ = {}; + /** + * @private + * @type {Array.} constructors Layer renderers. + */ +MapRenderer.prototype.registerLayerRenderers = function(constructors) { + this.layerRendererConstructors_.push.apply(this.layerRendererConstructors_, constructors); +}; + + +/** + * Get the registered layer renderer constructors. + * @return {Array.} Registered layer renderers. + */ +MapRenderer.prototype.getLayerRendererConstructors = function() { + return this.layerRendererConstructors_; +}; + + /** * @param {module:ol/PluggableMap~FrameState} frameState FrameState. * @protected @@ -202,12 +225,11 @@ MapRenderer.prototype.getLayerRenderer = function(layer) { if (layerKey in this.layerRenderers_) { return this.layerRenderers_[layerKey]; } else { - const layerRendererPlugins = getLayerRendererPlugins(); let renderer; - for (let i = 0, ii = layerRendererPlugins.length; i < ii; ++i) { - const plugin = layerRendererPlugins[i]; - if (plugin['handles'](layer)) { - renderer = plugin['create'](this, layer); + for (let i = 0, ii = this.layerRendererConstructors_.length; i < ii; ++i) { + const candidate = this.layerRendererConstructors_[i]; + if (candidate['handles'](layer)) { + renderer = candidate['create'](this, layer); break; } } diff --git a/src/ol/renderer/canvas/ImageLayer.js b/src/ol/renderer/canvas/ImageLayer.js index 2f95d7cc40..df67b38651 100644 --- a/src/ol/renderer/canvas/ImageLayer.js +++ b/src/ol/renderer/canvas/ImageLayer.js @@ -10,7 +10,6 @@ import {equals} from '../../array.js'; import {getHeight, getIntersection, getWidth, isEmpty} from '../../extent.js'; import VectorRenderType from '../../layer/VectorRenderType.js'; import {assign} from '../../obj.js'; -import {getLayerRendererPlugins} from '../../plugins.js'; import IntermediateCanvasRenderer from '../canvas/IntermediateCanvas.js'; import {create as createTransform, compose as composeTransform} from '../../transform.js'; @@ -73,7 +72,7 @@ CanvasImageLayerRenderer['handles'] = function(layer) { CanvasImageLayerRenderer['create'] = function(mapRenderer, layer) { const renderer = new CanvasImageLayerRenderer(/** @type {module:ol/layer/Image~ImageLayer} */ (layer)); if (layer.getType() === LayerType.VECTOR) { - const candidates = getLayerRendererPlugins(); + const candidates = mapRenderer.getLayerRendererConstructors(); for (let i = 0, ii = candidates.length; i < ii; ++i) { const candidate = /** @type {Object.} */ (candidates[i]); if (candidate !== CanvasImageLayerRenderer && candidate['handles'](layer)) {