64 lines
2.8 KiB
HTML
64 lines
2.8 KiB
HTML
<h2>Stats Dashboard — Chart Priority</h2>
|
||
<p class="subtitle">Which charts should be <strong>full-width</strong> (high importance) vs half-width? Select all that you want full-width.</p>
|
||
|
||
<div class="options" data-multiselect>
|
||
<div class="option" data-choice="boxplot" onclick="toggleSelect(this)">
|
||
<div class="letter">📊</div>
|
||
<div class="content">
|
||
<h3>AVG FPS Boxplot</h3>
|
||
<p>Min / Q1 / Median / Q3 / Max per device. Shows spread and outliers. Core metric.</p>
|
||
</div>
|
||
</div>
|
||
<div class="option" data-choice="historical" onclick="toggleSelect(this)">
|
||
<div class="letter">📈</div>
|
||
<div class="content">
|
||
<h3>Historical AVG FPS (Stacked Area)</h3>
|
||
<p>FPS trend over time by Proton/SteamOS version. Shows if updates help or hurt performance.</p>
|
||
</div>
|
||
</div>
|
||
<div class="option" data-choice="upscaler-bar" onclick="toggleSelect(this)">
|
||
<div class="letter">🎮</div>
|
||
<div class="content">
|
||
<h3>FPS by Upscaler & Frame Gen (Grouped Bar)</h3>
|
||
<p>Compare FPS across FSR versions × frame gen methods. Shows the real cost/benefit of each combo.</p>
|
||
</div>
|
||
</div>
|
||
<div class="option" data-choice="device-pie" onclick="toggleSelect(this)">
|
||
<div class="letter">🖥️</div>
|
||
<div class="content">
|
||
<h3>Entries per Device (Donut)</h3>
|
||
<p>Simple count of benchmarks per hardware. Shows data coverage.</p>
|
||
</div>
|
||
</div>
|
||
<div class="option" data-choice="fps-range" onclick="toggleSelect(this)">
|
||
<div class="letter">📉</div>
|
||
<div class="content">
|
||
<h3>FPS Range: Low vs High (Range Bar)</h3>
|
||
<p>Visualizes fpsLow to fpsHigh spread per entry. Shows consistency — tight range = stable performance.</p>
|
||
</div>
|
||
</div>
|
||
<div class="option" data-choice="load-times" onclick="toggleSelect(this)">
|
||
<div class="letter">⏱️</div>
|
||
<div class="content">
|
||
<h3>Load Times: SSD vs SD (Bar)</h3>
|
||
<p>Compare storage load times. Only shows when data exists. Useful for games with long loads.</p>
|
||
</div>
|
||
</div>
|
||
<div class="option" data-choice="proton-breakdown" onclick="toggleSelect(this)">
|
||
<div class="letter">🐧</div>
|
||
<div class="content">
|
||
<h3>Proton Version Breakdown (Stacked Bar)</h3>
|
||
<p>Distribution of entries by Proton version. Shows which Proton builds are most tested.</p>
|
||
</div>
|
||
</div>
|
||
<div class="option" data-choice="verified-sentiment" onclick="toggleSelect(this)">
|
||
<div class="letter">✅</div>
|
||
<div class="content">
|
||
<h3>Community Trust: Verified & Votes (Horizontal Bar)</h3>
|
||
<p>Shows verified count + upvote/downvote ratio per entry. Helps identify the most trusted benchmarks.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<p class="subtitle" style="margin-top: 20px;">Charts you select will be full-width (one per row). Unselected charts will be half-width (2 per row).</p>
|