//get a reference to the element var myBtn = document.getElementById('btnDisplayOnMap');
function resizeIframe() { /* Set iframe height to the 4/5 of viewportheight. .mapcontainer has default height and min/max height limit. */ var eqMapContainerNewHeight = (4.0/5.0) * $(window).height(); $("#eqMapContainer", window.parent.document).height(eqMapContainerNewHeight);
}
//add event listener myBtn.addEventListener('click', function(event) {
var eqMapRow = document.getElementById("eqMapRow"); var eqMapContainer = document.getElementById("eqMapContainer");
/* check if already exists */ if(eqMapContainer == null) {
var eqMapRow = document.getElementById("eqMapRow"); var eqMapContainer = document.createElement("div"); var eqIFrame = document.createElement("iframe");
eqMapRow.classList.add('row'); eqMapRow.mapvisibility = 'on';
eqMapContainer.id = 'eqMapContainer'; eqMapContainer.classList.add('col-md-12'); eqMapContainer.classList.add('mapcontainer');
eqIFrame.id = 'eqIFrame'; eqIFrame.src = 'http://cnt.rm.ingv.it/maps/leaflet_geojson_plotter_eq?map_center_lon=0&map_center_lat=0&map_zoom=5&map_center_auto=1&map_zoom_auto=1&map_debug=0&stationXmlUrl=&geojsonUrl=http%3A%2F%2Fwebservices.ingv.it%2Ffdsnws%2Fevent%2F1%2Fquery%3Fstarttime%3D2018-08-14T00%253A00%253A00%26endtime%3D2018-08-21T23%253A59%253A59%26minmag%3D2%26maxmag%3D10%26mindepth%3D-10%26maxdepth%3D1000%26minlat%3D-90%26maxlat%3D90%26minlon%3D-180%26maxlon%3D180%26minversion%3D100%26orderby%3Dtime%26format%3Dgeojson%26limit%3D10000&geojsonEncodedVariable='; eqIFrame.classList.add('mapiframe');
eqMapRow.appendChild(eqMapContainer); eqMapContainer.appendChild(eqIFrame);
resizeIframe();
this.classList.add('btn-success'); } else { /* toggle mapvisibility */ if (eqMapRow.mapvisibility == 'off') { /* Set visible */ eqMapRow.mapvisibility = 'on';
this.classList.add('btn-success');
eqMapRow.classList.remove('hidden-xs'); eqMapRow.classList.remove('hidden-sm'); eqMapRow.classList.remove('hidden-md'); eqMapRow.classList.remove('hidden-lg');
resizeIframe(); } else { /* Set hidden */ eqMapRow.mapvisibility = 'off';
this.classList.remove('btn-success');
eqMapRow.classList.add('hidden-xs'); eqMapRow.classList.add('hidden-sm'); eqMapRow.classList.add('hidden-md'); eqMapRow.classList.add('hidden-lg'); } }
});
(Ordinamento Tempo Decrescente)