diff --git a/_blog/2023-09-23/calendar.css b/_blog/2023-09-23/calendar.css index 6527ddb..0fb6f0b 100644 --- a/_blog/2023-09-23/calendar.css +++ b/_blog/2023-09-23/calendar.css @@ -30,7 +30,7 @@ body{ right: 0; } .calendar-container-below { - padding-top: 434px; /* Adjust this value to be at least the height of .container */ + padding-top: 449px; /* Adjust this value to be at least the height of .container */ } @media (max-width: 1200px) { @@ -87,7 +87,7 @@ header .current-date{ } .calendar{ padding: 20px; - margin-bottom: 20px; + /* margin-bottom: 20px; */ } .calendar ul{ display: flex; diff --git a/_blog/2023-09-23/calendar.js b/_blog/2023-09-23/calendar.js index d38ed07..83b42d9 100644 --- a/_blog/2023-09-23/calendar.js +++ b/_blog/2023-09-23/calendar.js @@ -83,7 +83,7 @@ const renderCalendar_ = (year, daysTag, currentDateTag) => { }; const renderCalendar = () => { for (let i = 0; i < daysTagAll.length; i++) { - renderCalendar_(currYear - i, daysTagAll[i], currentDateTagAll[i]); + renderCalendar_(currYear - daysTagAll.length + i + 1, daysTagAll[i], currentDateTagAll[i]); } update_calendar(); // See traffic.js }; @@ -139,7 +139,7 @@ function centerScroll() { // Set the scroll position to the center // scrollContainer.scrollLeft = (scrollWidth - clientWidth) / 2; - scrollContainer.scrollLeft = 300; + scrollContainer.scrollLeft = scrollWidth - clientWidth - 300; } centerScroll(); diff --git a/_blog/2023-09-23/mega_calendar.js b/_blog/2023-09-23/mega_calendar.js index 491fc1b..591916f 100644 --- a/_blog/2023-09-23/mega_calendar.js +++ b/_blog/2023-09-23/mega_calendar.js @@ -88,7 +88,7 @@ const renderMegaCalendar = () => { // Now render the calendar for each year const currYear = new Date().getFullYear(); for (let i = 0; i < daysTagAll1.length; i++) { - renderMegaCalendar_(currYear - i, daysTagAll1[i], currentDateTagAll1[i]); + renderMegaCalendar_(currYear - daysTagAll1.length + i + 1, daysTagAll1[i], currentDateTagAll1[i]); } update_calendar(); // See traffic.js }; diff --git a/_blog/2023-09-23/traffic.js b/_blog/2023-09-23/traffic.js index 399d9a4..ddf0a92 100644 --- a/_blog/2023-09-23/traffic.js +++ b/_blog/2023-09-23/traffic.js @@ -89,14 +89,16 @@ function parseTsv(content) { const elem_id = `_${year}-${newDate.getMonth() + 1}-${newDate.getDate()}`; const elem = root.getElementById(elem_id); + const elems = root.querySelectorAll(`#${elem_id}`); + for (const elem of elems) { if (!elem) continue; // Not a day in the calendar + const number = parseInt(columns[coli].replace(/,/g, ""), 10); + const color = colorScale(number, min, max); + const numberStr = (number / 1000000).toFixed(2) + "M"; // Convert number to 1.23M - const number = parseInt(columns[coli].replace(/,/g, ""), 10); - const color = colorScale(number, min, max); - const numberStr = (number / 1000000).toFixed(2) + "M"; // Convert number to 1.23M - - elem.style.backgroundColor = color; - elem.setAttribute("data-after", numberStr); + elem.style.backgroundColor = color; + elem.setAttribute("data-after", numberStr); + } } } }