No data to display chart.
';
document.getElementById(chartLegendId).innerHTML = '';
document.getElementById('sdbtDownloadPdfButton').style.display = 'none';
return;
}
sdbt_displayDataTable(filteredData, selectedCountries, startYear, endYear, tableId, unit);
sdbt_displayDataChart(filteredData, selectedCountries, startYear, endYear, chartContainerId, chartLegendId, unit, dataTypeName);
document.getElementById('sdbtDownloadPdfButton').style.display = 'block';
}
function sdbt_displayDataTable(data, countries, startYr, endYr, tableId, unit) {
const table = document.getElementById(tableId);
const thead = table.querySelector('thead');
const tbody = table.querySelector('tbody');
thead.innerHTML = ''; tbody.innerHTML = '';
const yearsInRange = [];
for (let y = startYr; y <= endYr; y++) yearsInRange.push(y);
let headerRowHtml = '
| Country | ';
yearsInRange.forEach(year => headerRowHtml += `${year} | `);
headerRowHtml += '
|---|
';
thead.innerHTML = headerRowHtml;
countries.forEach(country => {
let rowHtml = `
| ${country} | `;
yearsInRange.forEach(year => {
const item = data.find(d => d.country === country && d.year === year);
const value = item ? item.value.toFixed(2) + unit : 'N/A';
rowHtml += `${value} | `;
});
rowHtml += '
';
tbody.innerHTML += rowHtml;
});
}
// --- SVG Charting Logic (Adapted) ---
function sdbt_displayDataChart(data, selectedCountries, startYr, endYr, chartContainerId, chartLegendId, yAxisUnit, dataTypeName) {
const chartContainer = document.getElementById(chartContainerId);
const legendContainer = document.getElementById(chartLegendId);
chartContainer.innerHTML = ''; legendContainer.innerHTML = '';
const margin = { top: 30, right: 30, bottom: 50, left: 60 };
const width = chartContainer.clientWidth > 0 ? chartContainer.clientWidth - margin.left - margin.right : 300; // Default if clientWidth is 0
const height = 400 - margin.top - margin.bottom;
const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
svg.setAttribute("width", chartContainer.clientWidth > 0 ? chartContainer.clientWidth : 300 + margin.left + margin.right);
svg.setAttribute("height", 400);
svg.setAttribute("viewBox", `0 0 ${chartContainer.clientWidth > 0 ? chartContainer.clientWidth : 300 + margin.left + margin.right} 400`);
svg.style.fontFamily = "'Segoe UI', Tahoma, Geneva, Verdana, sans-serif";
const chartG = document.createElementNS("http://www.w3.org/2000/svg", "g");
chartG.setAttribute("transform", `translate(${margin.left},${margin.top})`);
svg.appendChild(chartG);
const years = Array.from(new Set(data.map(d => d.year))).sort((a, b) => a - b);
let allValues = data.map(d => d.value).filter(v => typeof v === 'number');
if (allValues.length === 0) allValues = [0, 10]; // Default range
let minValue = Math.min(...allValues);
let maxValue = Math.max(...allValues);
const padding = (maxValue - minValue) * 0.1 || 1;
minValue -= padding; maxValue += padding;
if (maxValue === minValue) { minValue -= 1; maxValue += 1; }
const xScale = (year) => {
if (years.length <= 1) return width / 2;
return ( (year - years[0]) / (years[years.length - 1] - years[0] || 1) ) * width;
};
const yScale = (value) => height - ((value - minValue) / (maxValue - minValue || 1)) * height;
// Axes (similar to previous tools, adjust labels)
// X-axis
const xAxisG = document.createElementNS("http://www.w3.org/2000/svg", "g");
xAxisG.setAttribute("transform", `translate(0,${height})`);
chartG.appendChild(xAxisG);
const xAxisLine = document.createElementNS("http://www.w3.org/2000/svg", "line");
xAxisLine.setAttribute("x1", 0); xAxisLine.setAttribute("x2", width); xAxisLine.setAttribute("stroke", "#333");
xAxisG.appendChild(xAxisLine);
years.forEach(year => {
const x = xScale(year);
const tick = document.createElementNS("http://www.w3.org/2000/svg", "line");
tick.setAttribute("x1", x); tick.setAttribute("x2", x); tick.setAttribute("y1", 0); tick.setAttribute("y2", 5);
tick.setAttribute("stroke", "#333"); xAxisG.appendChild(tick);
const label = document.createElementNS("http://www.w3.org/2000/svg", "text");
label.setAttribute("x", x); label.setAttribute("y", 20); label.setAttribute("text-anchor", "middle"); label.style.fontSize = "10px";
label.textContent = year; xAxisG.appendChild(label);
});
const xAxisLabel = document.createElementNS("http://www.w3.org/2000/svg", "text");
xAxisLabel.setAttribute("x", width / 2); xAxisLabel.setAttribute("y", height + margin.bottom - 10);
xAxisLabel.setAttribute("text-anchor", "middle"); xAxisLabel.style.fontSize = "12px"; xAxisLabel.textContent = "Year";
chartG.appendChild(xAxisLabel);
// Y-axis
const yAxisG = document.createElementNS("http://www.w3.org/2000/svg", "g");
chartG.appendChild(yAxisG);
const yAxisLine = document.createElementNS("http://www.w3.org/2000/svg", "line");
yAxisLine.setAttribute("y1", 0); yAxisLine.setAttribute("y2", height); yAxisLine.setAttribute("stroke", "#333");
yAxisG.appendChild(yAxisLine);
const numTicksY = 5;
for (let i = 0; i <= numTicksY; i++) {
const val = minValue + (i / numTicksY) * (maxValue - minValue);
const y = yScale(val);
const tick = document.createElementNS("http://www.w3.org/2000/svg", "line");
tick.setAttribute("x1", -5); tick.setAttribute("x2", 0); tick.setAttribute("y1", y); tick.setAttribute("y2", y);
tick.setAttribute("stroke", "#333"); yAxisG.appendChild(tick);
const label = document.createElementNS("http://www.w3.org/2000/svg", "text");
label.setAttribute("x", -8); label.setAttribute("y", y + 4); label.setAttribute("text-anchor", "end"); label.style.fontSize = "10px";
label.textContent = val.toFixed(1) + yAxisUnit; yAxisG.appendChild(label);
}
const yAxisLabel = document.createElementNS("http://www.w3.org/2000/svg", "text");
yAxisLabel.setAttribute("transform", "rotate(-90)");
yAxisLabel.setAttribute("x", -height / 2); yAxisLabel.setAttribute("y", -margin.left + 15);
yAxisLabel.setAttribute("text-anchor", "middle"); yAxisLabel.style.fontSize = "12px"; yAxisLabel.textContent = `${dataTypeName} (${yAxisUnit})`;
chartG.appendChild(yAxisLabel);
// Zero line if applicable (common for yields, less so for high debt ratios)
if (minValue < 0 && maxValue > 0 && yAxisUnit === '%') { // More relevant for yields
const zeroY = yScale(0);
const zeroLine = document.createElementNS("http://www.w3.org/2000/svg", "line");
zeroLine.setAttribute("x1", 0); zeroLine.setAttribute("x2", width);
zeroLine.setAttribute("y1", zeroY); zeroLine.setAttribute("y2", zeroY);
zeroLine.setAttribute("stroke", "#aaa"); zeroLine.setAttribute("stroke-dasharray", "4 2");
chartG.appendChild(zeroLine);
}
// Lines and Legend
const colors = ["#007bff", "#28a745", "#dc3545", "#ffc107", "#17a2b8", "#6f42c1", "#fd7e14", "#20c997", "#6610f2", "#e83e8c"];
selectedCountries.forEach((country, index) => {
const countryData = data.filter(d => d.country === country && typeof d.value === 'number').sort((a, b) => a.year - b.year);
if (countryData.length === 0) return;
const points = countryData.map(d => `${xScale(d.year)},${yScale(d.value)}`).join(" ");
const polyline = document.createElementNS("http://www.w3.org/2000/svg", "polyline");
polyline.setAttribute("points", points); polyline.setAttribute("fill", "none");
polyline.setAttribute("stroke", colors[index % colors.length]); polyline.setAttribute("stroke-width", 2);
chartG.appendChild(polyline);
countryData.forEach(d => {
const circle = document.createElementNS("http://www.w3.org/2000/svg", "circle");
circle.setAttribute("cx", xScale(d.year)); circle.setAttribute("cy", yScale(d.value));
circle.setAttribute("r", 2.5); circle.setAttribute("fill", colors[index % colors.length]);
chartG.appendChild(circle);
});
const legendItem = document.createElement('div');
legendItem.style.marginRight = '15px'; legendItem.style.marginBottom = '5px';
legendItem.style.display = 'flex'; legendItem.style.alignItems = 'center';
const legendColorBox = document.createElement('span');
legendColorBox.style.display = 'inline-block'; legendColorBox.style.width = '12px'; legendColorBox.style.height = '12px';
legendColorBox.style.backgroundColor = colors[index % colors.length]; legendColorBox.style.marginRight = '5px';
legendItem.appendChild(legendColorBox);
legendItem.appendChild(document.createTextNode(country));
legendContainer.appendChild(legendItem);
});
chartContainer.appendChild(svg);
}
// --- PDF Download Logic (Adapted) ---
function sdbt_downloadPDF() {
const activeDataTypeKey = window.currentDataType;
const activeViewKey = window.currentViewType[activeDataTypeKey];
const tableId = (activeDataTypeKey === 'debtToGDP') ? 'sdbtDebtResultsTable' : 'sdbtYieldResultsTable';
const chartContainerId = (activeDataTypeKey === 'debtToGDP') ? 'sdbtDebtChartContainer' : 'sdbtYieldChartContainer';
const legendId = (activeDataTypeKey === 'debtToGDP') ? 'sdbtDebtChartLegend' : 'sdbtYieldChartLegend';
const dataTypeName = (activeDataTypeKey === 'debtToGDP') ? 'Sovereign Debt-to-GDP Ratio' : '10-Year Government Bond Yields';
const tableSection = document.getElementById(tableId);
const chartSVGContainer = document.getElementById(chartContainerId);
const legendSection = document.getElementById(legendId);
let filtersHTML = "
Selected Filters
";
const selectedCountries = Array.from(document.querySelectorAll('.sdbt-country-checkbox:checked')).map(cb => cb.value);
filtersHTML += `- Countries: ${selectedCountries.join(', ') || 'None'}
`;
filtersHTML += `- Start Year: ${document.getElementById('sdbtStartYear').value}
`;
filtersHTML += `- End Year: ${document.getElementById('sdbtEndYear').value}
`;
filtersHTML += `- Data Type: ${dataTypeName}
`;
filtersHTML += `- View: ${activeViewKey}
`;
filtersHTML += "
";
let contentHTML = "";
if (activeViewKey === 'TableView' || !activeViewKey) { // Default to table if view not set
contentHTML += tableSection ? `
${dataTypeName} - Data Table
${tableSection.outerHTML}` : `
${dataTypeName} Table data not available.
`;
}
if (activeViewKey === 'ChartView') {
contentHTML += `
${dataTypeName} - Data Chart
`;
const svgElement = chartSVGContainer ? chartSVGContainer.querySelector('svg') : null;
if (svgElement) {
const svgClone = svgElement.cloneNode(true);
svgClone.setAttribute('width', '700'); svgClone.setAttribute('height', '400');
svgClone.style.maxWidth = '100%';
contentHTML += svgClone.outerHTML;
if (legendSection) {
contentHTML += `
Legend
${legendSection.innerHTML}
`;
}
} else {
contentHTML += "
Chart not available or not generated.
";
}
}
const currentDateTime = new Date().toLocaleString();
const pdfContent = `
Sovereign Debt & Bond Yield Tracker Report
Generated: ${currentDateTime}
${filtersHTML}
${contentHTML}
This report uses a static, embedded dataset of historical data. For informational purposes only. Last data update: May 2025 (Sample Data).
`;
const pdfWindow = window.open('', '_blank');
if (pdfWindow) {
pdfWindow.document.write(pdfContent);
pdfWindow.document.close();
setTimeout(() => { pdfWindow.print(); }, 500);
} else {
alert("Popup blocked. Please allow popups for this site to download the report.");
}
}
