function pasteMap() { document.querySelector('#covid-canada-map-container').innerHTML = `` } function updateCharts(d, mapData) { let latestDate = mapData.tracking[mapData.tracking.length - 1].date; updateSquareChart(d.tracking[d.tracking.length - 1], d.properties.PRENAME); updateNewCurveChart("#covid-canada-date-chart", d, chartInput, latestDate); //updateDateChart('#covid-canada-date-chart', d, chartSettings.date.cumulative, mapData) } let chartInput = ["raw", "average", ["cases"]]; function fillOutMap(parent, data) { const maxProvinceCases = Math.max( ...data.features.map((d) => d.tracking[d.tracking.length - 1].total) ); const colorScale = d3.scaleLinear().domain([1, maxProvinceCases]).range(["#F9DC9F", "#F4BB3F"]); let container = document.querySelector(parent); let total = data.tracking[data.tracking.length - 1].total; container.querySelector(".map-total").innerHTML = total.toLocaleString(); container.querySelectorAll(".map-text").forEach((text) => { let provinceName = text.id.split("-text")[0].split("-").join(" "); let province = data.features.find((prov) => prov.properties.PRENAME === provinceName); let number = province.tracking[province.tracking.length - 1].total; text.innerHTML = number.toLocaleString(); }); container.querySelectorAll(".province").forEach((path) => { const provinceName = path.id.split("-path")[0].split("-").join(" "); const province = data.features.find((prov) => prov.properties.PRENAME === provinceName); const number = province.tracking[province.tracking.length - 1].total; path.style.fill = colorScale(number); path.addEventListener("click", function () { updateCharts(province, data); }); }); container.querySelectorAll(".map-circle").forEach((path) => { let provinceName = path.id.split("-circle")[0].split("-").join(" "); let province = data.features.find((prov) => prov.properties.PRENAME === provinceName); path.addEventListener("click", function () { updateCharts(province, data); }); }); container.querySelector("svg rect").addEventListener("click", function () { updateCharts(data, data); }); }