- Ejemplo de uso sencillo con OpenLayers 3 y una capa remota de GeoJSON del USGS.
- Ver http://earthquake.usgs.gov/earthquakes/feed/v1.0/ para más referencias
Last active
January 24, 2016 14:37
-
-
Save VictorVelarde/5021e3679dad1305d570 to your computer and use it in GitHub Desktop.
OpenLayers 3 - Terremotos recientes USGS
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="UTF-8"> | |
<title>Ejemplo sencillo con OL3</title> | |
<link href="http://fonts.googleapis.com/css?family=Open+Sans|Dosis:400,800" rel="stylesheet" type="text/css" /> | |
<!-- Versión específica vs. master | min vs. debug --> | |
<link rel="stylesheet" href="http://openlayers.org/en/v3.12.1/css/ol.css" type="text/css"> | |
<script src="http://openlayers.org/en/v3.12.1/build/ol-debug.js"></script> | |
<style> | |
/* General */ | |
h1 { | |
font-family: 'Dosis', sans-serif; | |
font-weight: 400; | |
font-size: 40px; | |
line-height: 46px; | |
margin-bottom: 10px; | |
color: #E50275; | |
} | |
body { | |
font-family: 'Open Sans', sans-serif; | |
background-color: #F7FBFF; | |
} | |
.ficha { | |
color: #03A1C4; | |
} | |
</style> | |
</head> | |
<body> | |
<h1>Mapa de terremotos significativos el último mes (USGS)</h1> | |
<div id="mapa" style="height: 400px; border: 2px gray solid;"></div> | |
<div id="seleccion" style="margin-top:10px"></div> | |
<!-- JavaScript --> | |
<script> | |
var mapa = new ol.Map({ | |
layers: [new ol.layer.Tile({ | |
source: new ol.source.OSM() | |
})], | |
target: 'mapa', | |
view: new ol.View({ | |
center: [0, 0], | |
zoom: 2 | |
}) | |
}); | |
mapa.addControl(new ol.control.OverviewMap()); | |
// carga de datos | |
var urlTerremotos = 'http://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/significant_month.geojson'; | |
var capaTerremotos = new ol.layer.Vector({ | |
source: new ol.source.Vector({ | |
url: urlTerremotos, | |
format: new ol.format.GeoJSON() | |
}) | |
}); | |
mapa.addLayer(capaTerremotos); | |
// interacción capa vectorial | |
var seleccion = new ol.interaction.Select(); | |
mapa.addInteraction(seleccion); | |
seleccion.on('select', function (e) { | |
// ol.interaction.SelectEvent | |
var div = document.getElementById('seleccion'); | |
var seleccionados = e.target.getFeatures(); | |
var html = ''; | |
seleccionados.forEach(function (t) { | |
html += '<div class="ficha"><ul>'; | |
html += '<li><strong>Lugar</strong>: ' + t.get('place') + '</li>'; | |
html += '<li><strong>Magnitud</strong>: ' + t.get('mag') + '</li>'; | |
html += '<li><strong>Fecha</strong>: ' + new Date(t.get('time')).toLocaleDateString() + '</li>'; | |
html += '</ul></div>'; | |
}); | |
div.innerHTML = html; | |
}); | |
</script> | |
</body> | |
</html> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{"type":"FeatureCollection","metadata":{"generated":1449438289000,"url":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/significant_month.geojson","title":"USGS Significant Earthquakes, Past Month","status":200,"api":"1.1.0","count":14},"features":[{"type":"Feature","properties":{"mag":7.1,"place":"Southeast Indian Ridge","time":1449267895830,"updated":1449339862575,"tz":360,"url":"http://earthquake.usgs.gov/earthquakes/eventpage/us100043z2","detail":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/detail/us100043z2.geojson","felt":null,"cdi":null,"mmi":0,"alert":"green","status":"reviewed","tsunami":0,"sig":776,"net":"us","code":"100043z2","ids":",us100043z2,gcmt20151204222455,","sources":",us,gcmt,","types":",cap,general-text,geoserve,losspager,moment-tensor,moment-tensor,nearby-cities,origin,phase-data,shakemap,","nst":null,"dmin":10.028,"rms":1.28,"gap":13,"magType":"mww","type":"earthquake","title":"M 7.1 - Southeast Indian Ridge"},"geometry":{"type":"Point","coordinates":[85.0934,-47.6429,10]},"id":"us100043z2"}, | |
{"type":"Feature","properties":{"mag":4.7,"place":"25km WSW of Medford, Oklahoma","time":1448876953490,"updated":1449324670268,"tz":-360,"url":"http://earthquake.usgs.gov/earthquakes/eventpage/us1000424d","detail":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/detail/us1000424d.geojson","felt":2635,"cdi":5.8,"mmi":4,"alert":"green","status":"reviewed","tsunami":0,"sig":920,"net":"us","code":"1000424d","ids":",us1000424d,","sources":",us,","types":",cap,dyfi,general-link,geoserve,losspager,moment-tensor,nearby-cities,origin,phase-data,shakemap,tectonic-summary,","nst":null,"dmin":0.163,"rms":0.56,"gap":67,"magType":"mwr","type":"earthquake","title":"M 4.7 - 25km WSW of Medford, Oklahoma"},"geometry":{"type":"Point","coordinates":[-98.0061,36.7371,5]},"id":"us1000424d"}, | |
{"type":"Feature","properties":{"mag":6.2,"place":"66km NNW of Taltal, Chile","time":1448658022680,"updated":1448908055479,"tz":-180,"url":"http://earthquake.usgs.gov/earthquakes/eventpage/us100041t7","detail":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/detail/us100041t7.geojson","felt":36,"cdi":5.5,"mmi":4,"alert":"green","status":"reviewed","tsunami":0,"sig":611,"net":"us","code":"100041t7","ids":",us100041t7,gcmt20151127210022,","sources":",us,gcmt,","types":",cap,dyfi,geoserve,losspager,moment-tensor,moment-tensor,nearby-cities,origin,phase-data,shakemap,tectonic-summary,","nst":null,"dmin":0.282,"rms":1.49,"gap":45,"magType":"mww","type":"earthquake","title":"M 6.2 - 66km NNW of Taltal, Chile"},"geometry":{"type":"Point","coordinates":[-70.6323,-24.8174,35]},"id":"us100041t7"}, | |
{"type":"Feature","properties":{"mag":6.7,"place":"127km SSW of Tarauaca, Brazil","time":1448516718300,"updated":1448639192000,"tz":-300,"url":"http://earthquake.usgs.gov/earthquakes/eventpage/us100041f1","detail":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/detail/us100041f1.geojson","felt":3,"cdi":2,"mmi":3,"alert":"green","status":"reviewed","tsunami":0,"sig":691,"net":"us","code":"100041f1","ids":",us100041f1,gcmt20151126054518,","sources":",us,gcmt,","types":",cap,dyfi,geoserve,losspager,moment-tensor,nearby-cities,origin,phase-data,shakemap,tectonic-summary,","nst":null,"dmin":2.018,"rms":1.19,"gap":19,"magType":"mwb","type":"earthquake","title":"M 6.7 - 127km SSW of Tarauaca, Brazil"},"geometry":{"type":"Point","coordinates":[-71.288,-9.1912,599.35]},"id":"us100041f1"}, | |
{"type":"Feature","properties":{"mag":7.6,"place":"210km S of Tarauaca, Brazil","time":1448405453770,"updated":1448498942039,"tz":-300,"url":"http://earthquake.usgs.gov/earthquakes/eventpage/us100040x6","detail":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/detail/us100040x6.geojson","felt":14,"cdi":4,"mmi":3,"alert":"green","status":"reviewed","tsunami":0,"sig":894,"net":"us","code":"100040x6","ids":",us100040x6,gcmt20151124225053,","sources":",us,gcmt,","types":",cap,dyfi,general-link,general-text,geoserve,losspager,moment-tensor,nearby-cities,origin,phase-data,shakemap,tectonic-summary,","nst":null,"dmin":2.84,"rms":0.99,"gap":15,"magType":"mww","type":"earthquake","title":"M 7.6 - 210km S of Tarauaca, Brazil"},"geometry":{"type":"Point","coordinates":[-71.0226,-10.0475,611.71]},"id":"us100040x6"}, | |
{"type":"Feature","properties":{"mag":7.6,"place":"169km WNW of Iberia, Peru","time":1448405138060,"updated":1448673401370,"tz":-300,"url":"http://earthquake.usgs.gov/earthquakes/eventpage/us100040ww","detail":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/detail/us100040ww.geojson","felt":105,"cdi":6,"mmi":3,"alert":"green","status":"reviewed","tsunami":1,"sig":952,"net":"us","code":"100040ww","ids":",pt15328051,at00nycck1,us100040ww,gcmt20151124224538,","sources":",pt,at,us,gcmt,","types":",cap,dyfi,general-link,general-text,geoserve,impact-link,losspager,moment-tensor,nearby-cities,origin,phase-data,shakemap,tectonic-summary,","nst":null,"dmin":3.317,"rms":0.93,"gap":16,"magType":"mww","type":"earthquake","title":"M 7.6 - 169km WNW of Iberia, Peru"},"geometry":{"type":"Point","coordinates":[-70.9038,-10.5484,600.63]},"id":"us100040ww"}, | |
{"type":"Feature","properties":{"mag":4.7,"place":"13km SW of Cherokee, Oklahoma","time":1447918932760,"updated":1449093927608,"tz":-360,"url":"http://earthquake.usgs.gov/earthquakes/eventpage/us10003zgz","detail":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/detail/us10003zgz.geojson","felt":6454,"cdi":5.3,"mmi":5.81,"alert":"green","status":"reviewed","tsunami":0,"sig":870,"net":"us","code":"10003zgz","ids":",us10003zgz,","sources":",us,","types":",cap,dyfi,general-link,geoserve,losspager,moment-tensor,nearby-cities,origin,phase-data,shakemap,tectonic-summary,","nst":null,"dmin":0.246,"rms":0.18,"gap":98,"magType":"mwr","type":"earthquake","title":"M 4.7 - 13km SW of Cherokee, Oklahoma"},"geometry":{"type":"Point","coordinates":[-98.4612,36.661,6.23]},"id":"us10003zgz"}, | |
{"type":"Feature","properties":{"mag":7,"place":"118km SW of Dadali, Solomon Islands","time":1447871464600,"updated":1447904464877,"tz":660,"url":"http://earthquake.usgs.gov/earthquakes/eventpage/us10003zcp","detail":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/detail/us10003zcp.geojson","felt":7,"cdi":5.4,"mmi":6.47,"alert":"green","status":"reviewed","tsunami":1,"sig":758,"net":"us","code":"10003zcp","ids":",pt15322050,at00ny0wrr,us10003zcp,gcmt20151118183104,","sources":",pt,at,us,gcmt,","types":",cap,dyfi,geoserve,impact-link,losspager,moment-tensor,moment-tensor,nearby-cities,origin,phase-data,shakemap,tectonic-summary,","nst":null,"dmin":1.6,"rms":0.82,"gap":23,"magType":"mww","type":"earthquake","title":"M 7.0 - 118km SW of Dadali, Solomon Islands"},"geometry":{"type":"Point","coordinates":[158.4102,-8.9288,13.39]},"id":"us10003zcp"}, | |
{"type":"Feature","properties":{"mag":6.5,"place":"10km WSW of Nidri, Greece","time":1447744207300,"updated":1448961971204,"tz":120,"url":"http://earthquake.usgs.gov/earthquakes/eventpage/us10003ywp","detail":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/detail/us10003ywp.geojson","felt":23,"cdi":5.8,"mmi":8,"alert":"yellow","status":"reviewed","tsunami":0,"sig":663,"net":"us","code":"10003ywp","ids":",us10003ywp,gcmt20151117071008,","sources":",us,gcmt,","types":",cap,dyfi,general-link,general-text,geoserve,impact-text,losspager,moment-tensor,moment-tensor,moment-tensor,nearby-cities,origin,phase-data,shakemap,tectonic-summary,","nst":null,"dmin":null,"rms":0.98,"gap":null,"magType":"mww","type":"earthquake","title":"M 6.5 - 10km WSW of Nidri, Greece"},"geometry":{"type":"Point","coordinates":[20.6,38.67,11]},"id":"us10003ywp"}, | |
{"type":"Feature","properties":{"mag":6.7,"place":"140km WSW of Makurazaki, Japan","time":1447447890990,"updated":1447519941206,"tz":540,"url":"http://earthquake.usgs.gov/earthquakes/eventpage/us10003y71","detail":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/detail/us10003y71.geojson","felt":24,"cdi":4.3,"mmi":5.12,"alert":"green","status":"reviewed","tsunami":1,"sig":701,"net":"us","code":"10003y71","ids":",us10003y71,pt15317050,at00nxrty3,gcmt20151113205131,","sources":",us,pt,at,gcmt,","types":",associate,cap,dyfi,geoserve,impact-link,impact-text,losspager,moment-tensor,moment-tensor,moment-tensor,moment-tensor,nearby-cities,origin,phase-data,shakemap,tectonic-summary,","nst":null,"dmin":1.445,"rms":1.13,"gap":17,"magType":"mww","type":"earthquake","title":"M 6.7 - 140km WSW of Makurazaki, Japan"},"geometry":{"type":"Point","coordinates":[128.8768,30.9915,12]},"id":"us10003y71"}, | |
{"type":"Feature","properties":{"mag":6.9,"place":"92km NW of Coquimbo, Chile","time":1447209979900,"updated":1447898323687,"tz":-300,"url":"http://earthquake.usgs.gov/earthquakes/eventpage/us10003x9g","detail":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/detail/us10003x9g.geojson","felt":21,"cdi":4.6,"mmi":5.19,"alert":"green","status":"reviewed","tsunami":0,"sig":742,"net":"us","code":"10003x9g","ids":",us10003x9g,gcmt20151111024619,","sources":",us,gcmt,","types":",cap,dyfi,geoserve,impact-text,losspager,moment-tensor,moment-tensor,moment-tensor,nearby-cities,origin,phase-data,shakemap,tectonic-summary,","nst":null,"dmin":0.893,"rms":1.5,"gap":28,"magType":"mww","type":"earthquake","title":"M 6.9 - 92km NW of Coquimbo, Chile"},"geometry":{"type":"Point","coordinates":[-72.1288,-29.4726,10]},"id":"us10003x9g"}, | |
{"type":"Feature","properties":{"mag":6.9,"place":"82km NW of Coquimbo, Chile","time":1447206878510,"updated":1449198084825,"tz":-300,"url":"http://earthquake.usgs.gov/earthquakes/eventpage/us10003x8t","detail":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/detail/us10003x8t.geojson","felt":47,"cdi":5.5,"mmi":5,"alert":"green","status":"reviewed","tsunami":1,"sig":758,"net":"us","code":"10003x8t","ids":",pt15315051,at00nxmnz2,us10003x8t,gcmt20151111015437,","sources":",pt,at,us,gcmt,","types":",cap,dyfi,geoserve,impact-link,impact-text,losspager,moment-tensor,moment-tensor,moment-tensor,moment-tensor,nearby-cities,origin,phase-data,shakemap,tectonic-summary,","nst":null,"dmin":0.801,"rms":1.16,"gap":27,"magType":"mww","type":"earthquake","title":"M 6.9 - 82km NW of Coquimbo, Chile"},"geometry":{"type":"Point","coordinates":[-72.0218,-29.4961,12]},"id":"us10003x8t"}, | |
{"type":"Feature","properties":{"mag":6.4,"place":"128km NW of Sabang, Indonesia","time":1447001222140,"updated":1447043842000,"tz":360,"url":"http://earthquake.usgs.gov/earthquakes/eventpage/us10003vry","detail":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/detail/us10003vry.geojson","felt":6,"cdi":5.2,"mmi":4.27,"alert":"green","status":"reviewed","tsunami":0,"sig":633,"net":"us","code":"10003vry","ids":",us10003vry,gcmt20151108164702,","sources":",us,gcmt,","types":",cap,dyfi,geoserve,losspager,moment-tensor,nearby-cities,origin,phase-data,shakemap,tectonic-summary,","nst":null,"dmin":2.783,"rms":1.23,"gap":31,"magType":"mwb","type":"earthquake","title":"M 6.4 - 128km NW of Sabang, Indonesia"},"geometry":{"type":"Point","coordinates":[94.6609,6.8456,10]},"id":"us10003vry"}, | |
{"type":"Feature","properties":{"mag":6.8,"place":"40km SW of Ovalle, Chile","time":1446881503850,"updated":1449242510040,"tz":-180,"url":"http://earthquake.usgs.gov/earthquakes/eventpage/us10003vgt","detail":"http://earthquake.usgs.gov/earthquakes/feed/v1.0/detail/us10003vgt.geojson","felt":202,"cdi":5.9,"mmi":7,"alert":"green","status":"reviewed","tsunami":1,"sig":831,"net":"us","code":"10003vgt","ids":",pt15311052,at00nxfowl,us10003vgt,gcmt20151107073143,","sources":",pt,at,us,gcmt,","types":",cap,dyfi,geoserve,impact-link,impact-text,losspager,moment-tensor,moment-tensor,moment-tensor,nearby-cities,origin,phase-data,shakemap,tectonic-summary,","nst":null,"dmin":0.255,"rms":0.77,"gap":41,"magType":"mww","type":"earthquake","title":"M 6.8 - 40km SW of Ovalle, Chile"},"geometry":{"type":"Point","coordinates":[-71.469,-30.8859,46]},"id":"us10003vgt"}],"bbox":[-98.4612,-47.6429,5,158.4102,38.67,611.71]} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment