ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Increase readability of reprojection example

Browse Source 
Use map/layer terminology more clearly and clarify checkbox usage
This commit is contained in:
Petr Sloup
2015-09-09 19:27:44 +02:00
parent 0f09607725
commit 00a8b4da16
2 changed files with 9 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
examples/reprojection.html
View File

@@ -15,14 +15,14 @@ resources:
<form class="form-inline"> <form class="form-inline">
<div class="col-md-3"> <div class="col-md-3">
<label>Base map:</label> <label>Base map:</label>
<select id="base-map"> <select id="base-layer">
<option value="mapquest">MapQuest (EPSG:3857)</option> <option value="mapquest">MapQuest (EPSG:3857)</option>
<option value="wms4326">WMS (EPSG:4326)</option> <option value="wms4326">WMS (EPSG:4326)</option>
</select> </select>
</div> </div>
<div class="col-md-4"> <div class="col-md-4">
<label>Overlay map:</label> <label>Overlay map:</label>
<select id="overlay-map"> <select id="overlay-layer">
<option value="bng">British National Grid (EPSG:27700)</option> <option value="bng">British National Grid (EPSG:27700)</option>
<option value="wms21781">Swisstopo WMS (EPSG:21781)</option> <option value="wms21781">Swisstopo WMS (EPSG:21781)</option>
<option value="wmts3413">NASA Arctic WMTS (EPSG:3413)</option> <option value="wmts3413">NASA Arctic WMTS (EPSG:3413)</option>
@@ -43,6 +43,6 @@ resources:
<option value="EPSG:5479">RSRGD2000 / MSLC2000 (EPSG:5479)</option> <option value="EPSG:5479">RSRGD2000 / MSLC2000 (EPSG:5479)</option>
</select> </select>
</div> </div>
<label for="render-edges"><input type="checkbox" id="render-edges" />Render reprojection edges</label> <label for="render-edges"><input type="checkbox" id="render-edges" />Render reprojection edges</label> (only displayed on reprojected data)
</form> </form>
</div> </div>

12
examples/reprojection.js
View File

@@ -163,8 +163,8 @@ var map = new ol.Map({
}); });
var baseMapSelect = document.getElementById('base-map'); var baseLayerSelect = document.getElementById('base-layer');
var overlayMapSelect = document.getElementById('overlay-map'); var overlayLayerSelect = document.getElementById('overlay-layer');
var viewProjSelect = document.getElementById('view-projection'); var viewProjSelect = document.getElementById('view-projection');
var renderEdgesCheckbox = document.getElementById('render-edges'); var renderEdgesCheckbox = document.getElementById('render-edges');
var renderEdges = false; var renderEdges = false;
@@ -204,8 +204,8 @@ var updateRenderEdgesOnLayer = function(layer) {
/** /**
* @param {Event} e Change event. * @param {Event} e Change event.
*/ */
baseMapSelect.onchange = function(e) { baseLayerSelect.onchange = function(e) {
var layer = layers[baseMapSelect.value]; var layer = layers[baseLayerSelect.value];
if (layer) { if (layer) {
layer.setOpacity(1); layer.setOpacity(1);
updateRenderEdgesOnLayer(layer); updateRenderEdgesOnLayer(layer);
@@ -217,8 +217,8 @@ baseMapSelect.onchange = function(e) {
/** /**
* @param {Event} e Change event. * @param {Event} e Change event.
*/ */
overlayMapSelect.onchange = function(e) { overlayLayerSelect.onchange = function(e) {
var layer = layers[overlayMapSelect.value]; var layer = layers[overlayLayerSelect.value];
if (layer) { if (layer) {
layer.setOpacity(0.7); layer.setOpacity(0.7);
updateRenderEdgesOnLayer(layer); updateRenderEdgesOnLayer(layer);