Add 'projection' and 'coordinateFormat' to ol.control.MousePosition

This commit is contained in:
Frederic Junod
2013-06-20 11:56:49 +02:00
parent 9d63217778
commit 22adf354e2
4 changed files with 99 additions and 29 deletions

View File

@@ -30,11 +30,6 @@
<div class="row-fluid">
<div class="span12">
<div id="map" class="map"></div>
<select id="projection">
<option value="EPSG:4326">EPSG:4326</option>
<option value="EPSG:3857">EPSG:3857</option>
</select>
<div style="display: inline-block;" id="mouse-position"></div>
</div>
</div>
@@ -48,7 +43,23 @@
</div>
<div id="tags">mouse-position, openstreetmap</div>
</div>
<div class="span8 pull-right">
<div id="mouse-position">&nbsp;</div>
</div>
</div>
<div class="row-fluid">
<div class="span8">
<form>
<label>Projection </label>
<select id="projection">
<option value="EPSG:4326">EPSG:4326</option>
<option value="EPSG:3857">EPSG:3857</option>
</select>
<label>Precision </label>
<input id="precision" type="number" min="0" max="12" value="4"/>
</form>
</div>
</div>
</div>

View File

@@ -4,7 +4,9 @@ goog.require('ol.View2D');
goog.require('ol.control.MousePosition');
goog.require('ol.control.defaults');
goog.require('ol.coordinate');
goog.require('ol.dom.Input');
goog.require('ol.layer.TileLayer');
goog.require('ol.proj');
goog.require('ol.source.OSM');
var control = new ol.control.MousePosition({
@@ -32,6 +34,13 @@ var map = new ol.Map({
})
});
document.getElementById('projection').addEventListener('change', function() {
control.setProjection(this.value);
}, false);
var projection = new ol.dom.Input(document.getElementById('projection'));
projection.on('change:value', function() {
control.setProjection(ol.proj.get(projection.getValue()));
});
var precision = new ol.dom.Input(document.getElementById('precision'));
precision.on('change:value', function() {
var format = ol.coordinate.createStringXY(precision.getValue());
control.setCoordinateFormat(format);
});