diff --git a/static/js/dashboard.js b/static/js/dashboard.js index 56bc1d9..5599261 100644 --- a/static/js/dashboard.js +++ b/static/js/dashboard.js @@ -1,5 +1,5 @@ // creates all charts -async function makeDashboard(fileName, placename, placetype, src) { +async function makeDashboard(fileName, placename, placetype) { previous = ""; neutral = "fa-sort"; ascending = "fa-sort-asc"; @@ -10,7 +10,7 @@ async function makeDashboard(fileName, placename, placetype, src) { DATA = await d3.csv(fileName, type); CF = crossfilter(DATA); srcDim = CF.dimension(d => d.src) - changeDataSource(src) + changeSrc() if (placetype == 'county') { countyDim = CF.dimension(d => d.county); countyDim.filter(d => d === placename) @@ -101,12 +101,23 @@ function resetAll() { updateAll(); }; -function changeDataSource(src) { +function changeSrc() { + const svgIcon = src === 'EMS' ? 'ambulance_icon_blues.svg' : 'morguetable_5.svg' + const txtIcon = src === 'EMS' ? 'ambulance' : 'morgue table' + tableIcon = L.icon({ + iconUrl: '/static/markers/' + svgIcon, + iconSize: [25,25], // size of the icon + iconAnchor: [15,15], // point of the icon which will correspond to marker's location + }); d3.select('#datasource').text(`${src} - SIMULATED`) + d3.select('#dataicon') + .attr('src',`/static/markers/${svgIcon}`) + .attr('alt',`${txtIcon} represents ${src} data`) srcDim.filter(d => d === src) } -function updateDataSource(src) { - changeDataSource(src) +function updateSrc(source) { + src = source + changeSrc() updateAll() } \ No newline at end of file diff --git a/static/js/htmlTable.js b/static/js/htmlTable.js index 59e823f..a60fee8 100644 --- a/static/js/htmlTable.js +++ b/static/js/htmlTable.js @@ -4,7 +4,7 @@ function makeHtmlTable() { table = d3.select("#sosTable") thead = table.append('thead').append('tr') .selectAll('th') - .data(d => headers) + .data(headers) .join('th') .text((d,i) => i = 1 ? formatHTMLthings(d): d) .attr('class', (d,i) => headers[i] + " sortable") @@ -20,11 +20,11 @@ function makeHtmlTable() { // updates HTML table function updateHtmlTable(data) { row = tbody.selectAll('tr') - .data(data) - .join('tr') + .data(data) + .join('tr') row.selectAll('td') - .data((d) => d3.values(d).slice(0,-3)) - .join('td') + .data(d => d3.values(d).slice(0,-3)) + .join('td') .text((d,i) => i == 0 ? formatHTMLthings(d) : d) }; function formatHTMLthings(d){ diff --git a/static/js/map.js b/static/js/map.js index 80cd2e6..4b53548 100644 --- a/static/js/map.js +++ b/static/js/map.js @@ -2,7 +2,6 @@ function createMap() {// Mapbox section L.mapbox.accessToken = 'pk.eyJ1Ijoic3RjaG9pIiwiYSI6ImNqd2pkNWN0NzAyNnE0YW8xeTl5a3VqMXQifQ.Rq3qT82-ysDHcMsHGTBiQg'; layers = { - // 'main': L.mapbox.styleLayer('mapbox://styles/mapbox/streets-v11'), 'Light': L.mapbox.styleLayer('mapbox://styles/mapbox/light-v10'), 'Dark': L.mapbox.styleLayer('mapbox://styles/mapbox/dark-v10'), 'Main': L.mapbox.styleLayer('mapbox://styles/stchoi/cjwky60dk0toy1cm8fnhngzrv') @@ -25,7 +24,7 @@ function createMap() {// Mapbox section color: '#72add4', fillOpacity: 0.30 }; - } + } L.control.layers(layers).addTo(map); // add basemap control featureLayer = L.mapbox.featureLayer().addTo(map); @@ -54,6 +53,7 @@ function drawMarkers() { .bindPopup(`

${formatDate(pt.date)}
${pt.county}
${pt.Age} ${pt.Race} ${pt.Gender}

`)) }; }; + function updateMap(bounds) { latDim.filter([bounds.getSouth(), bounds.getNorth()]) lngDim.filter([bounds.getWest(), bounds.getEast()]) diff --git a/templates/dashboard.html b/templates/dashboard.html index 8706298..bab9a28 100644 --- a/templates/dashboard.html +++ b/templates/dashboard.html @@ -71,8 +71,8 @@ @@ -119,11 +119,7 @@

{{ data.titlename }}

- {% if data.src == 'EMS' %} - ambulance represents EMS data - {% elif data.src == 'ME' %} - morgue table represents ME data - {% endif %} + @@ -260,42 +256,15 @@

{{ thing }}

- - {% if data.src == "EMS" %} - - - {% elif data.src == "ME" %} - - {% endif %}