diff --git a/examples/stamen.html b/examples/stamen.html index 811d378633..930c971209 100644 --- a/examples/stamen.html +++ b/examples/stamen.html @@ -35,11 +35,11 @@

Stamen example

-

Example of a Stamen tile source.

+

Example of a Stamen tile source. Two layers are composed: the watercolor base layer with the terrain labels.

See the stamen.js source to see how this is done.

-
stamen, watercolor
+
stamen, watercolor, terrain-labels, two-layers
diff --git a/examples/stamen.js b/examples/stamen.js index ff505b2364..0cfbaa966a 100644 --- a/examples/stamen.js +++ b/examples/stamen.js @@ -3,27 +3,28 @@ goog.require('ol.Map'); goog.require('ol.RendererHints'); goog.require('ol.View2D'); goog.require('ol.layer.TileLayer'); +goog.require('ol.projection'); goog.require('ol.source.Stamen'); -var layers = [ - new ol.layer.TileLayer({ - source: new ol.source.Stamen({ - layer: 'watercolor' - }) - }), - new ol.layer.TileLayer({ - source: new ol.source.Stamen({ - layer: 'terrain-labels' - }) - }) -]; var map = new ol.Map({ - layers: layers, + layers: [ + new ol.layer.TileLayer({ + source: new ol.source.Stamen({ + layer: 'watercolor' + }) + }), + new ol.layer.TileLayer({ + source: new ol.source.Stamen({ + layer: 'terrain-labels' + }) + }) + ], renderers: ol.RendererHints.createFromQueryData(), target: 'map', view: new ol.View2D({ - center: new ol.Coordinate(0, 0), - zoom: 3 + center: ol.projection.transformWithCodes( + new ol.Coordinate(-122.416667, 37.783333), 'EPSG:4326', 'EPSG:3857'), + zoom: 12 }) });