43 lines
1.8 KiB
HTML
43 lines
1.8 KiB
HTML
---
|
|
layout: example.html
|
|
title: Shaded Relief
|
|
shortdesc: Calculate shaded relief from elevation data
|
|
docs: >
|
|
<p>
|
|
This example uses a <code>ol.source.Raster</code> to generate data
|
|
based on another source. The raster source accepts any number of
|
|
input sources (tile or image based) and runs a pipeline of
|
|
operations on the input data. The return from the final
|
|
operation is used as the data for the output source.
|
|
</p>
|
|
<p>
|
|
In this case, a single tiled source of elevation data is used as input.
|
|
The shaded relief is calculated in a single "image" operation. By setting
|
|
<code>operationType: 'image'</code> on the raster source, operations are
|
|
called with an <code>ImageData</code> object for each of the input sources.
|
|
Operations are also called with a general purpose <code>data</code> object.
|
|
In this example, the sun elevation and azimuth data from the inputs above
|
|
are assigned to this <code>data</code> object and accessed in the shading
|
|
operation. The shading operation returns an array of <code>ImageData</code>
|
|
objects. When the raster source is used by an image layer, the first
|
|
<code>ImageData</code> object returned by the last operation in the pipeline
|
|
is used for rendering.
|
|
</p>
|
|
tags: "raster, shaded relief"
|
|
---
|
|
<div id="map" class="map"></div>
|
|
<table class="controls">
|
|
<tr>
|
|
<td>vertical exaggeration: <span id="vertOut"></span>x</td>
|
|
<td><input id="vert" type="range" min="1" max="5" value="1"/></td>
|
|
</tr>
|
|
<tr>
|
|
<td>sun elevation: <span id="sunElOut"></span>°</td>
|
|
<td><input id="sunEl" type="range" min="0" max="90" value="45"/></td>
|
|
</tr>
|
|
<tr>
|
|
<td>sun azimuth: <span id="sunAzOut"></span>°</td>
|
|
<td><input id="sunAz" type="range" min="0" max="360" value="45"/></td>
|
|
</tr>
|
|
</table>
|