63 lines
2.2 KiB
JavaScript
63 lines
2.2 KiB
JavaScript
/**
|
|
* UI Renderer Module for Metric Visualization
|
|
* Verantwortlich für DOM-Updates und Darstellung von Summary und Tabelle
|
|
* © 2026 Donau2Space.de
|
|
*/
|
|
|
|
/**
|
|
* Rendert die Zusammenfassungspanel-Informationen.
|
|
* @param {Array} data - Analyse-Daten [{run_id, t_index_visible, t_gate_read, delta_t, warn_rate, unknown_rate}]
|
|
*/
|
|
export function renderSummarySection(data = []) {
|
|
const container = document.getElementById('summary-section');
|
|
if (!container) return;
|
|
|
|
const totalRuns = data.length;
|
|
const deltaNegCount = data.filter(d => d.delta_t < 0).length;
|
|
|
|
const avgWarnRate = totalRuns === 0 ? 0 : data.reduce((acc, d) => acc + (d.warn_rate ?? 0), 0) / totalRuns;
|
|
const avgUnknownRate = totalRuns === 0 ? 0 : data.reduce((acc, d) => acc + (d.unknown_rate ?? 0), 0) / totalRuns;
|
|
|
|
container.innerHTML = '';
|
|
|
|
const summaryHtml = `
|
|
<div class="summary__item"><strong>Runs:</strong> ${totalRuns}</div>
|
|
<div class="summary__item"><strong>Δt < 0 Count:</strong> ${deltaNegCount}</div>
|
|
<div class="summary__item"><strong>Ø Warn Rate:</strong> ${(avgWarnRate * 100).toFixed(2)}%</div>
|
|
<div class="summary__item"><strong>Ø Unknown Rate:</strong> ${(avgUnknownRate * 100).toFixed(2)}%</div>
|
|
`;
|
|
|
|
container.insertAdjacentHTML('beforeend', summaryHtml);
|
|
}
|
|
|
|
/**
|
|
* Befüllt Tabelle mit individuellen Run-Metriken.
|
|
* @param {Array} data - Analyse-Daten [{run_id, t_index_visible, t_gate_read, delta_t, warn_rate, unknown_rate}]
|
|
*/
|
|
export function renderDataTable(data = []) {
|
|
const table = document.getElementById('data-table');
|
|
if (!table) return;
|
|
|
|
const tbody = table.querySelector('tbody');
|
|
if (!tbody) return;
|
|
|
|
tbody.innerHTML = '';
|
|
|
|
const rows = data.map(d => {
|
|
const isDeltaNeg = d.delta_t < 0;
|
|
const rowClass = isDeltaNeg ? 'data-table__row--negative' : '';
|
|
|
|
return `
|
|
<tr class="data-table__row ${rowClass}" aria-label="Run ${d.run_id}">
|
|
<td>${d.run_id}</td>
|
|
<td>${d.t_index_visible}</td>
|
|
<td>${d.t_gate_read}</td>
|
|
<td>${d.delta_t}</td>
|
|
<td>${(d.warn_rate * 100).toFixed(2)}%</td>
|
|
<td>${(d.unknown_rate * 100).toFixed(2)}%</td>
|
|
</tr>
|
|
`;
|
|
}).join('');
|
|
|
|
tbody.insertAdjacentHTML('beforeend', rows);
|
|
}
|