diff --git a/examples/side-by-side.html b/examples/side-by-side.html index aadcb3c856..4defaff50b 100644 --- a/examples/side-by-side.html +++ b/examples/side-by-side.html @@ -1,10 +1,10 @@ --- layout: example.html title: Shared Views -shortdesc: The three maps, one WebGL, one Canvas, one DOM, share the same center, resolution, rotation and layers. +shortdesc: Two maps with different renderers share view properties docs: > - The three maps, one WebGL, one Canvas, one DOM, share the same center, resolution, rotation and layers. -tags: "side-by-side, canvas, webgl, dom, canvas, sync, object" + Two maps (one with the Canvas renderer, one with the WebGL renderer) share the same center, resolution, rotation and layers. +tags: "side-by-side, canvas, webgl" ---

Canvas

@@ -13,5 +13,3 @@ tags: "side-by-side, canvas, webgl, dom, canvas, sync, object" -

DOM

-
diff --git a/examples/side-by-side.js b/examples/side-by-side.js index 056a95ce13..43a03a3d4c 100644 --- a/examples/side-by-side.js +++ b/examples/side-by-side.js @@ -4,33 +4,27 @@ goog.require('ol.has'); goog.require('ol.layer.Tile'); goog.require('ol.source.OSM'); - -var map1 = new ol.Map({ - layers: [ - new ol.layer.Tile({ - source: new ol.source.OSM() - }) - ], - renderer: 'dom', - target: 'domMap', - view: new ol.View({ - center: [0, 0], - zoom: 1 - }) +var layer = new ol.layer.Tile({ + source: new ol.source.OSM() }); -var map2 = new ol.Map({ +var view = new ol.View({ + center: [0, 0], + zoom: 1 +}); + +var map1 = new ol.Map({ target: 'canvasMap', - layers: map1.getLayers(), - view: map1.getView() + layers: [layer], + view: view }); if (ol.has.WEBGL) { - var map3 = new ol.Map({ - renderer: 'webgl', + var map2 = new ol.Map({ target: 'webglMap', - layers: map1.getLayers(), - view: map1.getView() + renderer: 'webgl', + layers: [layer], + view: view }); } else { var info = document.getElementById('no-webgl');