A Leaflet control to choose features using an HTML select element
by Alex Azuero
HTML
<script src="http://cdn.leafletjs.com/leaflet-0.7.5/leaflet.js"></script>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.5/leaflet.css">
<div id="map" style="width:500px; height:500px"></div>
JavaScript
////////////////////////////////////////////////////////////////////////////////////////////
//setting up the map//
////////////////////////////////////////////////////////////////////////////////////////////
var map = new L.Map('map').setView([-13, -54], 3);
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
attribution: '© <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
////////////////////////////////////////////////////////////////////////////////////////////
//adding the data//
////////////////////////////////////////////////////////////////////////////////////////////
var rbmc = {
"type": "FeatureCollection",
"crs": {
"type": "name",
"properties": {
"name": "urn:ogc:def:crs:OGC:1.3:CRS84"
}
},
"features": [{
"type": "Feature",
"properties": {
"ESTACAO": "96111",
"UF": "MG",
"MUNICIPIO": "Rio Paranaíba",
"GEOCODIGO": "3155504",
"FONTECOORD": "GPS GEODÉSICO",
"ALTGEOM": "1.123,485",
"DATUM_PLAN": "SIRGAS2000",
"SG_RBMC": "MGRP",
"URL": "<a href='ftp://geoftp.ibge.gov.br/RBMC/relatorio/Descritivo_MGRP.pdf' target='_blank'>link</a>",
"DADOS": "<a href='http://www.ibge.gov.br/home/geociencias/geodesia/rbmc/rbmcpesq.shtm?c=9' target='_blank'>link</a>"
},
"geometry": {
"type": "Point",
"coordinates": [-46.132551833299999, -19.209860611100002]
}
}, {
"type": "Feature",
"properties": {
"ESTACAO": "96175",
"UF": "MG",
"MUNICIPIO": "Varginha",
"GEOCODIGO": "3170701",
"FONTECOORD": "GPS GEODÉSICO",
"ALTGEOM": "957,192",
"DATUM_PLAN": "SIRGAS2000",
"SG_RBMC": "MGV1",
...