lbreitkopf commited on
Commit
df31915
·
1 Parent(s): dba26fd

Extra plots

Browse files
Files changed (1) hide show
  1. index.html +63 -10
index.html CHANGED
@@ -92,6 +92,26 @@
92
 
93
  /* A11y: reduce motion */
94
  @media (prefers-reduced-motion: reduce){ *{ transition:none!important; animation:none!important } }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
95
  </style>
96
  </head>
97
  <body>
@@ -206,17 +226,50 @@
206
  </div>
207
  <figcaption class="muted">Task labels (demo): <strong>object</strong>=<code>paperbox</code>, <strong>material</strong>=<code>cardboard</code>, <strong>outcome</strong>=<code>bounce</code></figcaption>
208
  </figure>
209
- <div class="media-card">
210
- <figure>
211
- <img src="XModel_gain-2.png" alt="Overall performance heatmap (placeholder)" loading="lazy" style="width:100%; border-radius:.6rem" />
212
- <figcaption class="muted">Overall heatmap.</figcaption>
213
- </figure>
214
- <!-- <figure style="margin-top:.8rem">
215
- <img src="assets/confusion.png" alt="Confusion matrix (placeholder)" loading="lazy" style="width:100%; border-radius:.6rem" />
216
- <figcaption class="muted">Confusion matrix (example).</figcaption>
217
- </figure> -->
218
  </div>
219
- </div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
220
  </section>
221
 
222
  <section id="contact" class="section">
 
92
 
93
  /* A11y: reduce motion */
94
  @media (prefers-reduced-motion: reduce){ *{ transition:none!important; animation:none!important } }
95
+
96
+ /* --- Results grids (for figures) --- */
97
+ .results-group{ margin-top:.8rem }
98
+ .results-group h3{ margin:.2rem 0 .4rem; font-size:1rem; color:var(--muted) }
99
+ .grid-2{
100
+ display:grid; grid-template-columns:repeat(2,1fr); gap:1rem;
101
+ }
102
+ .grid-3{
103
+ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem;
104
+ }
105
+ @media (max-width: 900px){
106
+ .grid-2, .grid-3{ grid-template-columns:1fr }
107
+ }
108
+ .figure-card img{
109
+ width:100%; height:auto; border-radius:.6rem; display:block;
110
+ box-shadow:0 2px 12px rgba(0,0,0,.08);
111
+ }
112
+ .figure-card figcaption{
113
+ font-size:.9rem; color:var(--muted); margin-top:.35rem;
114
+ }
115
  </style>
116
  </head>
117
  <body>
 
226
  </div>
227
  <figcaption class="muted">Task labels (demo): <strong>object</strong>=<code>paperbox</code>, <strong>material</strong>=<code>cardboard</code>, <strong>outcome</strong>=<code>bounce</code></figcaption>
228
  </figure>
229
+
230
+ <!-- Group 0: Cross-Modal Gain heatmap -->
231
+ <div class="results-group"
232
+ <h3>Cross-Modal Gain (CMG)</h3>
233
+ <figure class="figure-card">
234
+ <img src="XModel_gain-2.png" alt="Cross-Modal Gain heatmap" loading="lazy">
235
+ <figcaption>CMG across tasks and models.</figcaption>
236
+ </figure>
 
237
  </div>
238
+
239
+ <!-- Group 1: Average modality attribution (Audio vs Video) -->
240
+ <div class="results-group">
241
+ <h3>Average modality attribution (AV)</h3>
242
+ <div class="grid-2">
243
+ <figure class="figure-card">
244
+ <img src="Heatmap_Audio.png" alt="Average audio weight across models" loading="lazy">
245
+ <figcaption>Audio weight by model.</figcaption>
246
+ </figure>
247
+ <figure class="figure-card">
248
+ <img src="Heatmap_Video.png" alt="Average video weight across models" loading="lazy">
249
+ <figcaption>Video weight by model.</figcaption>
250
+ </figure>
251
+ </div>
252
+ </div>
253
+
254
+ <!-- Group 2: Top-1 accuracy per task -->
255
+ <div class="results-group">
256
+ <h3>Top-1 accuracy by task</h3>
257
+ <div class="grid-3">
258
+ <figure class="figure-card">
259
+ <img src="Accuracy_plot_material.png" alt="Top-1 accuracy for object recognition" loading="lazy">
260
+ <figcaption>Object.</figcaption>
261
+ </figure>
262
+ <figure class="figure-card">
263
+ <img src="Accuracy_plot_object.png" alt="Top-1 accuracy for material recognition" loading="lazy">
264
+ <figcaption>Material.</figcaption>
265
+ </figure>
266
+ <figure class="figure-card">
267
+ <img src="Accuracy_plot_outcome.png" alt="Top-1 accuracy for outcome prediction" loading="lazy">
268
+ <figcaption>Outcome.</figcaption>
269
+ </figure>
270
+ </div>
271
+ </div>
272
+
273
  </section>
274
 
275
  <section id="contact" class="section">