<link href="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.css" rel="stylesheet" />
<script src="http://cdn.leafletjs.com/leaflet-0.7.3/leaflet.js"></script>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/leaflet-providers/1.1.15/leaflet-providers.js"></script>
<div id="map" style="width: 100%; height: 380px;"> </div>
<script type="text/javascript">
var map = L.map('map');
var terrainTiles = L.tileLayer.provider('OpenTopoMap');
terrainTiles.addTo(map);
map.setView([42.733, 13.190], 1);
function addDataToMap(data, map) {
var dataLayer = L.geoJson(data, {
onEachFeature: function(feature, layer) {
var popupText = "Magnitude: " + feature.properties.mag
+ "<br>Location: " + feature.properties.place
+ "<br><a href='" + feature.properties.url + "'>More info";
layer.bindPopup(popupText); }
});
dataLayer.addTo(map);
}
$.getJSON("https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_hour.geojson", function(data) { addDataToMap(data, map); });
</script>
<p><br />
<big style="font-family: Ubuntu Condensed;">Attendere il caricamento della pagina.<br />
Il dato geolocalizzato in real time è riferito alle ultime scosse dell'ultima ora aggiornato ogni minuto.<br />
</big></p>