diff --git a/examples/export-jpeg.html b/examples/export-jpeg.html new file mode 100644 index 0000000000..cd7b4a4ec3 --- /dev/null +++ b/examples/export-jpeg.html @@ -0,0 +1,53 @@ + + + + + + + + + + Export JPEG example + + + +
+
+
+ OpenLayers 3 Examples +
    +
    • +
    • +
+
+
+
+ +
+ +
+
+
+ Export JPEG +
+
+ +
+ +
+

Export JPEG example

+

Example of exporting a map as a JPEG image.

+
+

See the export-jpeg.js source to see how this is done.

+
+
export-jpeg, openstreetmap
+
+ +
+ +
+ + + + + diff --git a/examples/export-jpeg.js b/examples/export-jpeg.js new file mode 100644 index 0000000000..42655117fd --- /dev/null +++ b/examples/export-jpeg.js @@ -0,0 +1,26 @@ +goog.require('ol.Coordinate'); +goog.require('ol.Map'); +goog.require('ol.RendererHint'); +goog.require('ol.View2D'); +goog.require('ol.layer.TileLayer'); +goog.require('ol.source.OpenStreetMap'); + + +var map = new ol.Map({ + layers: [ + new ol.layer.TileLayer({ + source: new ol.source.OpenStreetMap() + }) + ], + renderer: ol.RendererHint.CANVAS, + target: 'map', + view: new ol.View2D({ + center: new ol.Coordinate(0, 0), + zoom: 2 + }) +}); + +var exportJPEGElement = document.getElementById('export-jpeg'); +exportJPEGElement.addEventListener('click', function(e) { + e.target.href = map.getRenderer().getCanvas().toDataURL('image/jpeg'); +}, false);