Past Weather
Use the search bar to enter a location of interest (name, address, zip code, etc.). Or, use the map to find a location by using zoom/pan or Shift+Click+Drag and then click "Search this area ". A set of stations from that location will be displayed (if any exist). Select the desired station from the list or from the map to view available daily data for that station.
Stations returned are part of the GHCN (Global Historical Climatology Network)-Daily dataset. GHCN-D data may lag by a few days due to its comprehensive set of quality assurance checks. Only data with blank quality flags (did not fail any QA check) are returned.
Access GHCN-D
Only show stations that include:
Station Return Limit
The maximum number of stations that can be returned is limited to 1000. Zooming in to a smaller extent may reveal more stations in that area.
Station Plotting
A station whose period of record includes the currently selected date is represented with a blue disc. Stations whose period of record does not include the currently selected date are plotted as white.
- Period of Record includes date selected
- Period of Record DOES NOT include date selected
- Currently selected station
The map depicts the current location of each station. Detailed histories of station locations are available at the Historical Observing Metadata Repository (HOMR).
Access HOMR
' ); } }).fail(function(){ console.log('Failed to find suggestions in selected location'); //$('#station-list-div').html('
Failed to find suggestions in selected location
'); });}async function loopThroughSuggestions(suggestReturns, formSubmitted){ for (const suggestion of suggestReturns.suggestions) { await appendSuggestion(suggestion, formSubmitted); }}async function appendSuggestion(suggestion, formSubmitted){ // get ArcGIS World Geocoding Service suggestion metadata (namely, get bounding box to submit to Common Access) await $.ajax({ url : 'https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer/findAddressCandidates', data : 'f=json&maxLocations=10&singleLine=' + suggestion.text + '&magicKey=' + suggestion.magicKey, dataType : 'json' }).done(function(addressCandidateReturns){ if (addressCandidateReturns.candidates.length > 0) { // get location info $.each(addressCandidateReturns.candidates, function(ndx, candidate){ // add suggestion to list if ( $('option.locationSuggestion[value="' + candidate.address + '"]').length == 0 && candidate.extent.ymin !== undefined ) { addressCandidates[candidate.address] = { ymax: candidate.extent.ymax, xmin: candidate.extent.xmin, ymin: candidate.extent.ymin, xmax: candidate.extent.xmax }; var candidateOpt = '
'; $('#suggestions').append(candidateOpt); } }); if (!locationSubmitted && formSubmitted) { searchLocation(); } } else { $('#station-list-div').html( '
No candidates found in selected location
' ); } }).fail(function(){ console.log('Failed to return candidates from selected location'); /* $('#station-list-div').html( '
Failed to return candidates from selected location
' ); */ });}async function searchLocation(){ locationSubmitted = true; // if location submitted was not selected from suggestion list, submit first from list selectedLocation = ($('#loc').val() in addressCandidates ? $('#loc').val() : Object.keys(addressCandidates)[0]); // set bounding box from selected location bbox = [ addressCandidates[selectedLocation]['ymax'], addressCandidates[selectedLocation]['xmin'], addressCandidates[selectedLocation]['ymin'], addressCandidates[selectedLocation]['xmax'] ]; if (!init) { window.history.pushState( { location : selectedLocation }, 'Past Weather', '/access/past-weather/' + encodeURIComponent($('#loc').val()) ); } init = false; // submit location with bbox to get list of stations await getStationList();}async function searchMapBounds(){ locationSubmitted = true; selectedLocation = bbox.toString(); if (!init) { window.history.pushState( { location : selectedLocation }, 'Past Weather', '/access/past-weather/' + selectedLocation ); } init = false; await getStationList();}// Data Access Service Station Listfunction getStationList(){ $('#suggestions option').remove(); $( '#sortOpts, #station-list-div, #station-title, #date-select, #station-data, #download, #daily-summary, ' + '#timescales, #timeSeries, #timescales, #daily-summary' ).html(''); $('#timeSeries').removeClass('graph'); $('.overflowArrow').hide(); $('#station-list-div').removeClass('returns'); $('#filter').removeClass('hidden'); // remove time series zingchart.exec('timeSeries', 'destroy'); stationList = {}; // https://www.ncei.noaa.gov/support/access-search-service-api-user-documentation $.ajax({ url : 'https://www.ncei.noaa.gov/access/services/search/v1/data', data : 'dataset=' + selectedDataset + '&bbox=' + bbox + '&limit=' + stationLimit + '&format=json', dataType : 'json' }).done(function(stationsResults){ if ($.isEmptyObject(stationsResults) || stationsResults.results.length == 0) { $('#station-list-div').html( '
No stations were found for the selected location.
' ); updateMap(); } else { $('#station-list-div').addClass('returns'); $('#station-list-div').html('
'); stationList = { "type":"FeatureCollection", "features":[], "dataTypes":{} }; // loop through stations $.each(stationsResults.results, function(ndx, thisStation){ // skip stations with no period of record if (!thisStation.startDate) { return false; } // keep track of station data types and their start/end dates var dataTypeClassList = ''; stationList.dataTypes[thisStation.stations[0].id] = {}; $.each(thisStation.stations[0]['dataTypes'], function(ndx, dataTypeObj){ if (dataTypeObj.id in dataTypes) { stationList.dataTypes[thisStation.stations[0].id][dataTypeObj.id] = { startDate : dataTypeObj.startDate.split('T')[0], endDate : dataTypeObj.endDate.split('T')[0] }; dataTypeClassList += ' data-type-' + dataTypeObj.id; } }); var dataTypeList = []; $.each(dataTypes, function(dataType, dataTypeInfo){ if (dataType in stationList.dataTypes[thisStation.stations[0].id]) { dataTypeList.push( '' + '' ); } }) // add station to list var stationItem = '
' + '
' + '' + thisStation.stations[0].name + ' '+ '' + thisStation.stations[0].id + '' + '
' + '
' + thisStation.startDate.split("T")[0] + " – " + thisStation.endDate.split("T")[0] + ' ' + dataTypeList.join('') + '
' + '
' + '' + '
' ''; $('#station-list').append(stationItem); stationList.features.push({ "type":"Feature", "stationId":thisStation.stations[0].id, "geometry":{ "type":"Point", "coordinates":[thisStation.location.coordinates[0], thisStation.location.coordinates[1]] }, "properties":{ "stationName": thisStation.stations[0].name, "startDate": thisStation.startDate.split("T")[0], "endDate": thisStation.endDate.split("T")[0] } }); }); // show/hide stations based on selected filters filterStations(); // get min/max dates for all stations in list intMinDate = Math.min.apply(null, $('.station').map(function() { return parseInt($(this).attr('data-startdate').split('-').join('')); }).get()); intMaxDate = Math.max.apply(null, $('.station').map(function() { return parseInt($(this).attr('data-enddate').split('-').join('')); }).get()); minDate = String(intMinDate).substring(0, 4) + '-' + String(intMinDate).substring(4, 6) + '-' + String(intMinDate).substring(6); maxDate = String(intMaxDate).substring(0, 4) + '-' + String(intMaxDate).substring(4, 6) + '-' + String(intMaxDate).substring(6); // inital sort of stations by end date, start date, name initStationSort(); // if selected station in list var stationId, stationName, startDate, endDate; if (selectedStationId in stationList.dataTypes && !$('#id-' + selectedStationId).hasClass('hidden')) { stationId = selectedStationId, stationName = $('#id-' + stationId).data('stationname'), startDate = $('#id-' + stationId).data('startdate'), endDate = $('#id-' + stationId).data('enddate') if (!selectedDate) selectedDate = endDate; $('#station-list-div').animate( { scrollTop: $('#station-list-div').scrollTop() + $('#id-' + selectedStationId).position().top }, 500 ); } else if (selectedDate) { // else if selected date is set, select first station after sort that matches date $.each($('.station').not('.hidden'), function(){ if (selectedDate >= $(this).data('startdate') && selectedDate <= $(this).data('enddate')) { stationId = $(this).data('stationid'), stationName = $(this).data('stationname'), startDate = $(this).data('startdate'), endDate = $(this).data('enddate'); return false; } }); } else if (!stationId) { // else select first non-hidden station after sort stationId = $('.station').not('.hidden').first().data('stationid'), stationName = $('.station').not('.hidden').first().data('stationname'), startDate = $('.station').not('.hidden').first().data('startdate'), endDate = $('.station').not('.hidden').first().data('enddate'), selectedDate = endDate; } // get selected station data if (stationList.features.length > 0 && $('.station').not('.hidden').length > 0) { stationSelect(stationId, stationName, startDate, endDate); } // add sorting options if (stationsResults.results.length > 1) { if (stationsResults.results.length == stationLimit) { $('#station-return-limit').modal('show'); } var sortOpts = '' + 'Name' + '' + '' + 'Start Date' + '' + '' + 'End Date' + '' $('#sortOpts').html(sortOpts); $('#sortOpts .sort').click(function(){ sortList($(this).data('sort')); return false }); } else { $('#sortOpts').html(''); } stationListOverflowArrows(); $('.station').click(function(){ if ($(this).data('stationid') != selectedStationId) { stationSelect( $(this).data('stationid'), $(this).data('stationname'), $(this).data('startdate'), $(this).data('enddate') ); } return false; }); $('.station').mouseover(function(){ stationListMouseover($(this).data('stationid')); }).mouseout(function(){ stationListMouseout($(this).data('stationid')); }); updateMap(); //$('.sort').tooltip(); //$('.data-type-indicator, .sort').tooltip(); } }).fail(function(error){ $('#station-data, #date-select, #download, #daily-summary, #timescales, #timeSeries, #daily-summary').html(''); $('#timeSeries').removeClass('graph'); $('#station-list-div').html( '
' + 'Failed to return stations ' + '' + '
' ); $('#retry').click(getStationList); updateMap(); console.log( typeof error !== 'undefined' && 'responseJSON' in error && error.responseJSON && 'errors' in error.responseJSON ? error.responseJSON.errors : 'Common Access search error' ); }); $('#station-list-div').html( '
' + 'Retrieving Stations' + '
' + '
' );}// sort list by enddate, startdate, station namefunction initStationSort(){ var items = $('.station').get(); items.sort(function(a, b){ var endDateA = $(a).data('enddate').split('-').join(''), endDateB = $(b).data('enddate').split('-').join(''), startDateA = $(a).data('startdate').split('-').join(''), startDateB = $(b).data('startdate').split('-').join(''), nameA = $(a).data('stationname'), nameB = $(b).data('stationname'); if (endDateA == endDateB) { // alphabetical if (startDateA === startDateB) { return +(nameA > nameB) || +(nameA === nameB) - 1; } // oldest startdate return +(startDateA > startDateB) || -1; } // lasest enddate return -(endDateA > endDateB) || 1; }); $.each(items, function(ndx, listItem){ $('#station-list').append(listItem); /* This removes li from the old spot and moves it */ });}function sortList(param){ sortOrder++; $('#sortOpts .sort').removeClass('sortAsc sortDesc'); $('#sortOpts .sort:not([data-sort="reset"])').addClass('unsorted'); if (sortOrder == 3) { sortOrder = 0; initStationSort(); return false; } $('#sortOpts .sort[data-sort="' + param + '"]').removeClass('unsorted'); $('#sortOpts .sort[data-sort="' + param + '"]').addClass(sortOrder == 1 ? 'sortAsc' : 'sortDesc'); var items = $('.station').get(); items.sort(function(a, b){ var keyA = $(a).data(param), keyB = $(b).data(param); if (sortOrder == 1) { if (keyA > keyB) { return 1; } else if (keyA < keyB) { return -1; } } else { if (keyA < keyB) { return 1; } else if (keyA > keyB) { return -1; } } return 0; }); var ul = $('#station-list'); $.each(items, function(i, li){ ul.append(li); /* This removes li from the old spot and moves it */ });}function stationListOverflowArrows(){ showHideOverflowArrows(); $('.overflowArrow').click(function(){ scrollPosition = 0; if ($(this).is('#overflowBottomArrow')) { scrollPosition = $('#station-list-div').scrollTop() + $('#station-list-container').height(); if (scrollPosition > $('#station-list')[0].scrollHeight) { scrollPosition = $('#station-list')[0].scrollHeight; } } else if ($(this).is('#overflowTopArrow')) { scrollPosition = $('#station-list-div').scrollTop()-$('#station-list-container').height(); if (scrollPosition < 0) { scrollPosition = 0; } } $('#station-list-div').animate({scrollTop: scrollPosition}, 500); showHideOverflowArrows(); });}$('#station-list-div').scroll(function() { showHideOverflowArrows(); });function showHideOverflowArrows(){ // Show/Hide Top Arrow if ($('#station-list-div').scrollTop() > $('li.station').outerHeight()/2) { $('#overflowTopArrow').fadeIn('slow'); } else { $('#overflowTopArrow').fadeOut('slow'); } // Show/Hide Bottom Arrow if ($('#station-list').length > 0) { if ( $('#station-list-div').scrollTop() < $('#station-list')[0].scrollHeight - $('#station-list-container').height() - $('li.station').height() ) { $('#overflowBottomArrow').fadeIn('slow'); } else { $('#overflowBottomArrow').fadeOut('slow'); } } if ($('#station-list').outerHeight() > $('#station-list-div').height()) { $('#sortOpts').addClass('overflown'); $('#station-list-div').addClass('overflown'); } else { $('#sortOpts').removeClass('overflown'); $('#station-list-div').removeClass('overflown'); }}// Data Access Service Station Selectionasync function stationSelect(stationId, stationName, startDate, endDate){ selectedStationId = stationId; selectedStationName = stationName; setStationStylesOnMap(); // select station in station list $('.station').removeClass('selected'); $('.station .btn').prop('disabled', false); $(".station[data-stationid='" + stationId + "']").addClass('selected'); $(".station[data-stationid='" + stationId + "'] .btn").prop('disabled', true); // remove time series zingchart.exec('timeSeries', 'destroy'); $('#station-data, #station-title, #date-select, #timescales, #timeSeries, #download, #daily-summary').html(''); if (stationId === undefined) { $('#station-data').html(''); return false; } var homrUrl = 'https://www.ncei.noaa.gov/access/homr/', stnTitle = '' + stationName + ' (' + stationId + ') ' + '' + '' + '' + '
' + '
' + '
' + '
' + '' + '
Station Information
' + '
' + '
' + '
' + 'Station history and further details are available for ' + stationName + ' (' + stationId + ') through the ' + '' + 'Historical Observing Metadata Repository (HOMR)' + '.' + '
' + '
- ' + '
- ' + '' + 'Station-Level (MSHR) Data' + '' + ' ' + '
- ' + '' + 'Element-Level (PHR) Data' + '' + ' ' + '
- ' + '' + 'Location Data' + '' + ' ' + '
- ' + '' + 'Miscellaneous Data' + '' + ' ' + '
' + '
' + '
' + '' + 'Access HOMR' + '' + '' + '
' + '
' + '
' + '
', selectDate = '
' + '' + startDate + '—' + '' + endDate + '' + '
' + '
' + ' ' + '' + '' + ' ' + '' + '
', url = '/access/past-weather/' + stationId + '/data', download = 'Download Station\'s Data: ' + '' + '' + '' + ' ' + '' + '' + ' ' + '' + '' + ' ' + '' + '' + '' + ''; $('#station-title').html(stnTitle); $('#date-select').html(selectDate); $('#download').html(download); //$('#station-info, .data-download-link').tooltip(); setPrevNext(startDate, endDate); $(function() { $('#datepicker-date').datepicker({ changeMonth: true, changeYear: true, yearRange: minDate.substring(0, 4) + ':' + maxDate.substring(0, 4), selectOtherMonths: true, showAnim: 'slideDown', showButtonPanel: true, closeText: 'Cancel', showOtherMonths: true, minDate: minDate + ' 00:00:00', maxDate: maxDate + ' 00:00:00', constrainInput: true, dateFormat: 'yy-mm-dd', altField: '#date' }); }); $(function() { $('#datepicker-date').datepicker('setDate', selectedDate); $('#datepicker-date').datepicker().on('input change', function(e){ if (/^\d{4}-\d{2}-\d{2}$/.test(e.target.value) && date != e.target.value) { dateChange(e.target.value, startDate, endDate); } return false; }); }); await getStationTable(startDate, endDate);}function setPrevNext(startDate, endDate){ var dateObj = new Date(selectedDate + 'T00:00:00'), prevDateObj = new Date(dateObj), nextDateObj = new Date(dateObj); // set prevDate (-1 day) prevDateObj.setDate(prevDateObj.getDate()-1); var prevDate = prevDateObj.toISOString().split('T')[0]; // if selectedDate is greater than station's endDate, make prevDate = endDate $('#prev-date').data('date', (selectedDate > endDate ? endDate : prevDate)); if (prevDate < startDate) { $('#prev-date').addClass('selected'); $('#prev-date').attr('tabindex', '-1'); $('#next-date').attr('title', 'An earlier date is not available at this station.'); } else { $('#prev-date').removeClass('selected'); $('#prev-date').removeAttr('tabindex'); $('#prev-date').attr('title', (selectedDate > endDate ? endDate : prevDate)); } // set nextDate (+1 day) nextDateObj.setDate(nextDateObj.getDate() + 1); var nextDate = nextDateObj.toISOString().split('T')[0]; // if selectedDate is less than station's startDate, make nextDate = startDate $('#next-date').data('date', (selectedDate < startDate ? startDate : nextDate)); if (nextDate > endDate) { $('#next-date').addClass('selected'); $('#next-date').attr('tabindex', '-1'); $('#next-date').attr('title', 'A later date is not available at this station.'); } else { $('#next-date').removeClass('selected'); $('#next-date').removeAttr('tabindex'); $('#next-date').attr('title', (selectedDate < startDate ? startDate : nextDate)); } // "unbind" to prevent double clicking $('.stnInfoDateSelect').unbind('click').on('click', function(){ var thisDate = $(this).data('date'); if (thisDate >= startDate && thisDate <= endDate) dateSelectClick(thisDate); return false; });}function dateSelectClick(clickedDate){ $('#datepicker-date').datepicker().val(clickedDate).trigger('change'); return false;}function dateChange(newDate, startDate, endDate){ selectedDate = newDate; zingchart.exec('timeSeries', 'destroy'); $('.dateSelect').removeClass('selected'); $('.dateSelect').removeAttr('tabindex'); $(".dateSelect[data-date='" + selectedDate + "']").addClass('selected'); $(".dateSelect[data-date='" + selectedDate + "']").attr('tabindex', '-1'); $('#datepicker-date').datepicker('hide'); $('#datepicker-date').blur(); getStationTable(startDate, endDate); setPrevNext(startDate, endDate); updateMapDate(); setStationStylesOnMap(); filterStations();}function getStationTable(startDate, endDate){ var year = selectedDate.substr(0, 4), month = selectedDate.substr(5, 2)-0, yearMonth = selectedDate.substr(0, 7), daysInMonth = new Date(year, month, 0).getDate(), dailySummaryUrl = 'https://www.ncei.noaa.gov/access/services/data/v1?dataset=' + selectedDataset + '&startDate=' + yearMonth + '-01&endDate=' + yearMonth + '-' + daysInMonth + '&stations=' + selectedStationId + '&format=pdf', dailySummaryLink = '' + monthNames[month-1] + ' ' + year + ' Daily Summary ' + '
' + '', intSelectedYYYYMM = parseInt(yearMonth.split('-').join('')), intStartYYYYMM = parseInt(startDate.substr(0, 7).split('-').join('')), intEndYYYYMM = parseInt(endDate.substr(0, 7).split('-').join('')); $('#daily-summary').html( intSelectedYYYYMM >= intStartYYYYMM && intSelectedYYYYMM <= intEndYYYYMM ? dailySummaryLink : '' ); $('#daily-summary-link').tooltip(); // https://www.ncei.noaa.gov/support/access-data-service-api-user-documentation $.ajax({ url : "https://www.ncei.noaa.gov/access/services/data/v1", data : "dataset=" + selectedDataset + "&stations=" + selectedStationId + "&startDate=" + selectedDate + "&endDate=" + selectedDate + "&dataTypes=" + Object.keys(dataTypes).join(",") + //"&includeStationName=true&includeStationLocation=1" + "&includeAttributes=true&units=standard&format=json", dataType : "json" }).done(function(stationData){ var table = '
| ' + ' ' + '' + ' ' + '' + dataTypes[dataType].name + porDisp + ' ' + ' | ' + '' + valDisp + ' | ' + '
'); //$('.plotit').tooltip(); $('.dataTypeDateSelect').click(function(){ selectedDataType = $(this).data('datatype'); dateSelectClick($(this).data('date')); return false; }); $('.plotit:not(:disabled)').click(function(){ if (selectedDataType == $(this).val()) { return false; } $('.plotit').removeClass('selected'); selectedDataType = $(this).val(); drawTimeSeries(); $(this).addClass('selected'); $(this).blur(); return false; }); drawTimeSeries(); }).fail(function(){ $('#station-data').html( '
' + '' + 'Failed to load data for ' + selectedStationId + ' on ' + selectedDate + ' ' + '' + '
' ); $('#retry').click(function(){getStationTable(startDate, endDate);}); console.log( typeof error !== 'undefined' && 'responseJSON' in error && error.responseJSON && 'errors' in error.responseJSON ? error.responseJSON.errors : 'Common Access data error' ); }); $('#timeSeries').removeClass('graph'); $('#station-data').html( '
' + 'Retrieving data for ' + selectedStationId + ' on ' + selectedDate + '
' + '
' );}function drawTimeSeries(){ $.ajax({ url: '/access/past-weather/' + selectedStationId + (selectedDataType ? '/' + selectedDataType : '') + '/' + selectedDate }); var month = selectedDate.substr(5, 2)-0, day = selectedDate.substr(-2)-0, timescaleOpts = '
' + 'Time Series' + '
Rollover chart to display values. Click+Drag to zoom.
' + '' + '
' + '' + ''+ '' + '' + '' + '' + '' + '' + '
'; zingchart.exec('timeSeries', 'destroy'); $.ajax({ url : '/access/past-weather/' + selectedStationId + '/' + selectedDataType + '/' + selectedDate + '/' + selectedTimescale + '/zingchart-config.js' }).done(function(){ $('#timeSeries').html(''); $('#timeSeries').addClass('graph'); $('#timeSeries').attr('alt', 'Time Series for ' + selectedStationId); $('#timescales').html(timescaleOpts); $('#timescales input[name="timescale"]').change(function(){ selectedTimescale = $('#timescales input[name="timescale"]:checked').val(); drawTimeSeries() }); }).fail(function(){ $('.plotit').removeClass('selected'); $('#timeSeries').removeClass('graph'); var tsDisplay = ''; if (selectedDataType in stationList.dataTypes[selectedStationId]) { // if selectedStationId has dataType, but none is unflagged tsDisplay = '
' + dataTypes[selectedDataType].name + ' is listed as available at ' + selectedStationName + ' (' + selectedStationId + ') from ' + '' + stationList.dataTypes[selectedStationId][selectedDataType].startDate + '' + ' – ' + '' + stationList.dataTypes[selectedStationId][selectedDataType].endDate + '.' + '
' + '
' + 'No valid* '+ dataTypes[selectedDataType].name + ' data were found for the date(s) ' + 'requested.' + '
' + '
*Only data that did not fail any quality assurance check are returned.
'; } else { tsDisplay = '' + '⇝' + ' ' + 'No ' + dataTypes[selectedDataType].name + ' data is available for ' + selectedStationName + ' (' + selectedStationId + ').'; } $('#timeSeries').html('
' + tsDisplay + '
'); $('.tsDateSelect').click(function(){ dateSelectClick($(this).data('date')); return false;}); $('#timescales').html(timescaleOpts); $('#timescales input[name="timescale"]').change(function(){ selectedTimescale = $('#timescales input[name="timescale"]:checked').val(); drawTimeSeries(); }); }); $('#timeSeries').html( '
' + 'Retrieving ' + dataTypes[selectedDataType].name + ' Data' + '
' + '
' );}function drawMap() { map = L.map( "map-canvas", { zoomDelta : 1, zoomSnap : 0, zoomControl : false, gestureHandling : true, attributionControl : false, layers: [ L.tileLayer( 'https://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}{r}.png', { attribution: '© OpenStreetMap ' + 'contributors © CARTO', subdomains: 'abcd', maxZoom: 20 } ) ] } ); // Map.SelectArea map.selectArea.enable(); //map.selectArea.setCtrlKey(true); map.fitBounds(mapBounds); L.control.zoom({ position:"bottomleft" }).addTo(map); // add date var mapDate = L.control({ position: "topleft" }); mapDate.onAdd = function(map) { var div = L.DomUtil.create("div", "info title"); div.innerHTML += '
'; div.setAttribute("style", "text-shadow: 1px 1px #fff;"); return div; }; mapDate.addTo(map); searchAreaControl = L.control({ position: "topright" }); searchAreaControl.onAdd = function(map) { var div = L.DomUtil.create("div", "searchArea"); div.innerHTML += ''; return div; }; searchAreaControl.addTo(map); mapBounds = map.getBounds(); $("#searchAreaButton").click(function(){ // set bounding box from selected location bbox = [mapBounds._northEast.lat, mapBounds._southWest.lng, mapBounds._southWest.lat, mapBounds._northEast.lng]; $('#loc').val(bbox.toString()); searchMapBounds(); getMapBounds(); }); map.on('zoomend', getMapBounds); map.on('dragend', getMapBounds); window.onresize = getMapBounds;}function getMapBounds(){ mapBounds = map.getBounds(); //TODO: antimeridian artifacts mapBounds._southWest.lng = L.Util.wrapNum(mapBounds._southWest.lng, [-180, 180], true); mapBounds._northEast.lng = L.Util.wrapNum(mapBounds._northEast.lng, [-180, 180], true); if ( bbox && bbox[0]*1 == mapBounds._northEast.lat && bbox[1]*1 == mapBounds._southWest.lng && bbox[2]*1 == mapBounds._southWest.lat && bbox[3]*1 == mapBounds._northEast.lng ) { $('#searchAreaButton').prop('disabled', true); } else { $('#searchAreaButton').prop('disabled', false); }}function updateMap() { updateMapDate(); if (stationLayer && map.hasLayer(stationLayer)) { map.removeLayer(stationLayer); } mapBounds = [[bbox[2], bbox[1]], [bbox[0], bbox[3]]]; // fly to bounding box map.flyToBounds(mapBounds); plotStationLocations();}function plotStationLocations() { markerMap = {}; if (stationList.features && stationList.features.length > 0) { stationLayer = L.geoJSON(stationList, { style: function (thisStation) { return thisStation.properties && thisStation.properties.style; }, onEachFeature: onEachFeature, pointToLayer: function (thisStation, latlng) { var marker = L.circleMarker(latlng); markerMap[thisStation.stationId] = marker; return marker; } }); map.addLayer(stationLayer); } setStationStylesOnMap();}function updateMapDate(){ $('#mapDate').html( selectedDate ? 'Date: ' + selectedDate + ' ' + '' + '' : '' ); $('#map-info').tooltip();}function setStationStylesOnMap(){ var fillColor, color; $.each(markerMap, function(stationId, marker){ if ($('#id-' + stationId).hasClass('hidden')) { if (markerMap[stationId] && map.hasLayer(markerMap[stationId])) { map.removeLayer(markerMap[stationId]); } return; } else if ( selectedDate >= marker.feature.properties.startDate && selectedDate <= marker.feature.properties.endDate ) { fillColor = '#162e51'; color = '#2491ff'; } else { // missing date style fillColor = '#ffffff'; color = '#162e51'; } if (!map.hasLayer(markerMap[stationId])) { map.addLayer(markerMap[stationId]); } markerMap[stationId].setStyle({ radius: 5, fillColor: (stationId == selectedStationId ? '#52daf2' : fillColor), origFillColor: (stationId == selectedStationId ? '#52daf2' : fillColor), color: (stationId == selectedStationId ? fillColor : color), origColor: (stationId == selectedStationId ? fillColor : color), weight: 0.25, opacity: 1, fillOpacity: 1 }); }); if (selectedStationId in markerMap && !L.Browser.ie && !L.Browser.opera && !L.Browser.edge) { markerMap[selectedStationId].bringToFront(); }}function stationListMouseover(stationId){ if (stationId in markerMap) { if ( markerMap[stationId].feature.properties.startDate <= selectedDate && markerMap[stationId].feature.properties.endDate >= selectedDate ) { markerMap[stationId].setStyle({ fillColor: (stationId == selectedStationId ? '#2491ff' : '#0050d8') }); } else { // missing date markerMap[stationId].setStyle({ weight: 2, color: '#2491ff' }); } if (!L.Browser.ie && !L.Browser.opera && !L.Browser.edge) { markerMap[stationId].bringToFront(); } }}function stationListMouseout(stationId){ if (stationId in markerMap) { markerMap[stationId].setStyle({ fillColor: markerMap[stationId].options.origFillColor, color: markerMap[stationId].options.origColor, weight: 0.25 }); } if (selectedStationId in markerMap && !L.Browser.ie && !L.Browser.opera && !L.Browser.edge) { markerMap[selectedStationId].bringToFront(); }}function onEachFeature(feature, layer) { layer.on({ mouseover: stationMouseover, mouseout: stationMouseout, click: stationClick });}function stationMouseover(e) { // highlight station list $('#' + e.target.feature.stationId).addClass('hover'); var rolloverContent = '
' + e.target.feature.properties.stationName + '
' + '
' + e.target.feature.stationId + '
' + '
' + e.target.feature.properties.startDate + '—' + e.target.feature.properties.endDate + '
'; stationLayer.bindTooltip(rolloverContent, {sticky:true, className:'mapTooltip'}).addTo(map);}function stationMouseout(e) { // reset station list highlight $('#' + e.target.feature.stationId).removeClass('hover');}function stationClick(feature, layer){ if ($('#id-' + feature.target.feature.stationId).length >= 1) { $('#station-list-div').animate( { scrollTop: $('#station-list-div').scrollTop() + $('#id-' + feature.target.feature.stationId).position().top }, 500 ); } if (feature.target.feature.stationId != selectedStationId) { stationSelect( feature.target.feature.stationId, feature.target.feature.properties.stationName, feature.target.feature.properties.startDate, feature.target.feature.properties.endDate ); }}
