diff --git a/examples/static-image.html b/examples/static-image.html
index 60c1823c13..4e761dc286 100644
--- a/examples/static-image.html
+++ b/examples/static-image.html
@@ -34,8 +34,16 @@
Static image example
Example of a static image layer.
static image, xkcd
diff --git a/examples/static-image.js b/examples/static-image.js
index 6487af2b01..747d70b0b1 100644
--- a/examples/static-image.js
+++ b/examples/static-image.js
@@ -7,13 +7,14 @@ goog.require('ol.proj.Projection');
goog.require('ol.source.ImageStatic');
-// Maps always need a projection, but the static image is not geo-referenced,
-// and are only measured in pixels. So, we create a fake projection that the
-// map can use to properly display the layer.
-var pixelProjection = new ol.proj.Projection({
- code: 'pixel',
+// Map views always need a projection. Here we just want to map image
+// coordinates directly to map coordinates, so we create a projection that uses
+// the image extent in pixels.
+var extent = [0, 0, 1024, 968];
+var projection = new ol.proj.Projection({
+ code: 'xkcd-image',
units: 'pixels',
- extent: [0, 0, 1024, 968]
+ extent: extent
});
var map = new ol.Map({
@@ -26,16 +27,15 @@ var map = new ol.Map({
})
],
url: 'http://imgs.xkcd.com/comics/online_communities.png',
- imageSize: [1024, 968],
- projection: pixelProjection,
- imageExtent: pixelProjection.getExtent()
+ projection: projection,
+ imageExtent: extent
})
})
],
target: 'map',
view: new ol.View({
- projection: pixelProjection,
- center: ol.extent.getCenter(pixelProjection.getExtent()),
+ projection: projection,
+ center: ol.extent.getCenter(extent),
zoom: 2
})
});