Files
openlayers/examples/disable-image-smoothing.html
mike-000 560931e976 Set reprojection canvas context options
Add example of disabling image smoothing

Add test for reprojection context options
2019-12-20 11:41:42 +00:00

48 lines
1.6 KiB
HTML

---
layout: example.html
title: Disable Image Smoothing
shortdesc: Example of disabling image smoothing
docs: >
Example of disabling image smoothing when using raster DEM (digital elevation model) data.
The <b>imageSmoothingEnabled</b> (or for Internet Explorer <b>msImageSmoothingEnabled</b>) canvas
context property is set to false at the layer's <b>prerender</b> event. Additionally for a
reprojected source those properties must also be also be specified for the canvas contexts used in
the reprojection via the source's <b>reprojectionContextOptions</b> option. Elevation data is
calculated from the pixel value returned by <b>forEachLayerAtPixel<b>. For comparison a second map
with smoothing enabled returns inaccuate elevations which are very noticeable close to 3107 meters
due to how elevation is calculated from the pixel value.
tags: "disable image smoothing, xyz, maptiler, reprojection"
cloak:
- key: get_your_own_D6rA4zTHduk6KOKTXzGB
value: Get your own API key at https://www.maptiler.com/cloud/
---
<div class="wrapper">
<div class="half">
<h4>Smoothing Disabled</h4>
<div id="map1" class="map"></div>
<div>
<label>
Elevation
<span id="info1">0.0</span> meters
</label>
</div>
<div>
<label>
Imagery opacity
<input id="opacity" type="range" min="0" max="100" value="80" />
<span id="output"></span> %
</label>
</div>
</div>
<div class="half">
<h4>Uncorrected Comparison</h4>
<div id="map2" class="map"></div>
<div>
<label>
Elevation
<span id="info2">0.0</span> meters
</label>
</div>
</div>
</div>