tudor/school_compare
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Making adjustments to compare view

Browse Source
This commit is contained in:
Tudor Sitaru
2026-01-06 15:37:07 +00:00
parent 1433b6e727
commit a26d91426c
2 changed files with 32 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
frontend/app.js
View File

@@ -468,12 +468,21 @@ async function updateComparisonChart() {
}
function updateComparisonTable(comparison, metric, years) {
// Build header
const firstYear = years[0];
const lastYear = years[years.length - 1];
const prevYear = years.length > 1 ? years[years.length - 2] : null;
// Build header with explicit year ranges
let headerHtml = '<th>School</th>';
years.forEach(year => {
headerHtml += `<th>${year}</th>`;
});
headerHtml += '<th>Change</th>';
if (prevYear && prevYear !== firstYear) {
headerHtml += `<th title="Change from ${prevYear} to ${lastYear}">Δ 1yr</th>`;
}
if (years.length > 1) {
headerHtml += `<th title="Change from ${firstYear} to ${lastYear}">Δ ${firstYear}→${lastYear}</th>`;
}
elements.tableHeader.innerHTML = headerHtml;
// Build body - iterate in same order as selectedSchools for color consistency
@@ -487,19 +496,34 @@ function updateComparisonTable(comparison, metric, years) {
yearlyMap[d.year] = d[metric];
});
const firstValue = yearlyMap[years[0]];
const lastValue = yearlyMap[years[years.length - 1]];
const change = firstValue && lastValue ? (lastValue - firstValue).toFixed(2) : 'N/A';
const changeClass = parseFloat(change) >= 0 ? 'positive' : 'negative';
const firstValue = yearlyMap[firstYear];
const lastValue = yearlyMap[lastYear];
const prevValue = prevYear ? yearlyMap[prevYear] : null;
// Calculate 1-year change
const oneYearChange = prevValue != null && lastValue != null ? (lastValue - prevValue) : null;
const oneYearChangeStr = oneYearChange !== null ? oneYearChange.toFixed(1) : 'N/A';
const oneYearClass = oneYearChange !== null ? (oneYearChange >= 0 ? 'positive' : 'negative') : '';
// Calculate total change
const totalChange = firstValue != null && lastValue != null ? (lastValue - firstValue) : null;
const totalChangeStr = totalChange !== null ? totalChange.toFixed(1) : 'N/A';
const totalChangeClass = totalChange !== null ? (totalChange >= 0 ? 'positive' : 'negative') : '';
const color = CHART_COLORS[index % CHART_COLORS.length];
bodyHtml += `<tr>`;
bodyHtml += `<td><strong style="border-left: 3px solid ${color}; padding-left: 8px;">${escapeHtml(schoolData.school_info.school_name)}</strong></td>`;
years.forEach(year => {
const value = yearlyMap[year];
bodyHtml += `<td>${value !== undefined ? formatMetricValue(value, metric) : '-'}</td>`;
bodyHtml += `<td>${value != null ? formatMetricValue(value, metric) : '-'}</td>`;
});
bodyHtml += `<td class="${changeClass}">${change !== 'N/A' ? (parseFloat(change) >= 0 ? '+' : '') + change : change}</td>`;
if (prevYear && prevYear !== firstYear) {
bodyHtml += `<td class="${oneYearClass}">${oneYearChangeStr !== 'N/A' ? (oneYearChange >= 0 ? '+' : '') + oneYearChangeStr : oneYearChangeStr}</td>`;
}
if (years.length > 1) {
bodyHtml += `<td class="${totalChangeClass}">${totalChangeStr !== 'N/A' ? (totalChange >= 0 ? '+' : '') + totalChangeStr : totalChangeStr}</td>`;
}
bodyHtml += `</tr>`;
});
elements.tableBody.innerHTML = bodyHtml;