Mercurial > repos > goeckslab > image_learner

comparison utils.py @ 2:186424a7eca7 draft

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
planemo upload for repository https://github.com/goeckslab/gleam.git commit 91fa4aba245520fc0680088a07cead66bcfd4ed2
author goeckslab
date Thu, 03 Jul 2025 20:43:24 +0000
parents 39202fe5cf97
children
comparison
equal deleted inserted replaced
1:39202fe5cf97 2:186424a7eca7
153 str: HTML table representation. 153 str: HTML table representation.
154 """ 154 """
155 if isinstance(json_data, str): 155 if isinstance(json_data, str):
156 json_data = json.loads(json_data) 156 json_data = json.loads(json_data)
157 return json_to_nested_html_table(json_data) 157 return json_to_nested_html_table(json_data)
158
159
160 def build_tabbed_html(metrics_html: str, train_val_html: str, test_html: str) -> str:
161 return f"""
162 <style>
163 .tabs {{
164 display: flex;
165 align-items: center;
166 border-bottom: 2px solid #ccc;
167 margin-bottom: 1rem;
168 }}
169 .tab {{
170 padding: 10px 20px;
171 cursor: pointer;
172 border: 1px solid #ccc;
173 border-bottom: none;
174 background: #f9f9f9;
175 margin-right: 5px;
176 border-top-left-radius: 8px;
177 border-top-right-radius: 8px;
178 }}
179 .tab.active {{
180 background: white;
181 font-weight: bold;
182 }}
183 /* new help-button styling */
184 .help-btn {{
185 margin-left: auto;
186 padding: 6px 12px;
187 font-size: 0.9rem;
188 border: 1px solid #4CAF50;
189 border-radius: 4px;
190 background: #4CAF50;
191 color: white;
192 cursor: pointer;
193 }}
194 .tab-content {{
195 display: none;
196 padding: 20px;
197 border: 1px solid #ccc;
198 border-top: none;
199 }}
200 .tab-content.active {{
201 display: block;
202 }}
203 </style>
204
205 <div class="tabs">
206 <div class="tab active" onclick="showTab('metrics')">Config &amp; Results Summary</div>
207 <div class="tab" onclick="showTab('trainval')">Train/Validation Results</div>
208 <div class="tab" onclick="showTab('test')">Test Results</div>
209 <!-- always-visible help button -->
210 <button id="openMetricsHelp" class="help-btn">Help</button>
211 </div>
212
213 <div id="metrics" class="tab-content active">
214 {metrics_html}
215 </div>
216 <div id="trainval" class="tab-content">
217 {train_val_html}
218 </div>
219 <div id="test" class="tab-content">
220 {test_html}
221 </div>
222
223 <script>
224 function showTab(id) {{
225 document.querySelectorAll('.tab-content').forEach(el => el.classList.remove('active'));
226 document.querySelectorAll('.tab').forEach(el => el.classList.remove('active'));
227 document.getElementById(id).classList.add('active');
228 document.querySelector(`.tab[onclick*="${{id}}"]`).classList.add('active');
229 }}
230 </script>
231 """
232
233
234 def get_metrics_help_modal() -> str:
235 modal_html = """
236 <div id="metricsHelpModal" class="modal">
237 <div class="modal-content">
238 <span class="close">×</span>
239 <h2>Model Evaluation Metrics — Help Guide</h2>
240 <div class="metrics-guide">
241 <h3>1) General Metrics</h3>
242 <p><strong>Loss:</strong> Measures the difference between predicted and actual values. Lower is better. Often used for optimization during training.</p>
243 <p><strong>Accuracy:</strong> Proportion of correct predictions among all predictions. Simple but can be misleading for imbalanced datasets.</p>
244 <p><strong>Micro Accuracy:</strong> Calculates accuracy by summing up all individual true positives and true negatives across all classes, making it suitable for multiclass or multilabel problems.</p>
245 <p><strong>Token Accuracy:</strong> Measures how often the predicted tokens (e.g., in sequences) match the true tokens. Useful in sequence prediction tasks like NLP.</p>
246 <h3>2) Precision, Recall & Specificity</h3>
247 <p><strong>Precision:</strong> Out of all positive predictions, how many were correct. Precision = TP / (TP + FP). Helps when false positives are costly.</p>
248 <p><strong>Recall (Sensitivity):</strong> Out of all actual positives, how many were predicted correctly. Recall = TP / (TP + FN). Important when missing positives is risky.</p>
249 <p><strong>Specificity:</strong> True negative rate. Measures how well the model identifies negatives. Specificity = TN / (TN + FP). Useful in medical testing to avoid false alarms.</p>
250 <h3>3) Macro, Micro, and Weighted Averages</h3>
251 <p><strong>Macro Precision / Recall / F1:</strong> Averages the metric across all classes, treating each class equally, regardless of class frequency. Best when class sizes are balanced.</p>
252 <p><strong>Micro Precision / Recall / F1:</strong> Aggregates TP, FP, FN across all classes before computing the metric. Gives a global view and is ideal for class-imbalanced problems.</p>
253 <p><strong>Weighted Precision / Recall / F1:</strong> Averages each metric across classes, weighted by the number of true instances per class. Balances importance of classes based on frequency.</p>
254 <h3>4) Average Precision (PR-AUC Variants)</h3>
255 <p><strong>Average Precision Macro:</strong> Precision-Recall AUC averaged across all classes equally. Useful for balanced multi-class problems.</p>
256 <p><strong>Average Precision Micro:</strong> Global Precision-Recall AUC using all instances. Best for imbalanced data or multi-label classification.</p>
257 <p><strong>Average Precision Samples:</strong> Precision-Recall AUC averaged across individual samples (not classes). Ideal for multi-label problems where each sample can belong to multiple classes.</p>
258 <h3>5) ROC-AUC Variants</h3>
259 <p><strong>ROC-AUC:</strong> Measures model's ability to distinguish between classes. AUC = 1 is perfect; 0.5 is random guessing. Use for binary classification.</p>
260 <p><strong>Macro ROC-AUC:</strong> Averages the AUC across all classes equally. Suitable when classes are balanced and of equal importance.</p>
261 <p><strong>Micro ROC-AUC:</strong> Computes AUC from aggregated predictions across all classes. Useful in multiclass or multilabel settings with imbalance.</p>
262 <h3>6) Ranking Metrics</h3>
263 <p><strong>Hits at K:</strong> Measures whether the true label is among the top-K predictions. Common in recommendation systems and retrieval tasks.</p>
264 <h3>7) Confusion Matrix Stats (Per Class)</h3>
265 <p><strong>True Positives / Negatives (TP / TN):</strong> Correct predictions for positives and negatives respectively.</p>
266 <p><strong>False Positives / Negatives (FP / FN):</strong> Incorrect predictions — false alarms and missed detections.</p>
267 <h3>8) Other Useful Metrics</h3>
268 <p><strong>Cohen's Kappa:</strong> Measures agreement between predicted and actual values adjusted for chance. Useful for multiclass classification with imbalanced labels.</p>
269 <p><strong>Matthews Correlation Coefficient (MCC):</strong> Balanced measure of prediction quality that takes into account TP, TN, FP, and FN. Particularly effective for imbalanced datasets.</p>
270 <h3>9) Metric Recommendations</h3>
271 <ul>
272 <li>Use <strong>Accuracy + F1</strong> for balanced data.</li>
273 <li>Use <strong>Precision, Recall, ROC-AUC</strong> for imbalanced datasets.</li>
274 <li>Use <strong>Average Precision Micro</strong> for multilabel or class-imbalanced problems.</li>
275 <li>Use <strong>Macro scores</strong> when all classes should be treated equally.</li>
276 <li>Use <strong>Weighted scores</strong> when class imbalance should be accounted for without ignoring small classes.</li>
277 <li>Use <strong>Confusion Matrix stats</strong> to analyze class-wise performance.</li>
278 <li>Use <strong>Hits at K</strong> for recommendation or ranking-based tasks.</li>
279 </ul>
280 </div>
281 </div>
282 </div>
283 """
284 modal_css = """
285 <style>
286 .modal {
287 display: none;
288 position: fixed;
289 z-index: 1;
290 left: 0;
291 top: 0;
292 width: 100%;
293 height: 100%;
294 overflow: auto;
295 background-color: rgba(0,0,0,0.4);
296 }
297 .modal-content {
298 background-color: #fefefe;
299 margin: 15% auto;
300 padding: 20px;
301 border: 1px solid #888;
302 width: 80%;
303 max-width: 800px;
304 }
305 .close {
306 color: #aaa;
307 float: right;
308 font-size: 28px;
309 font-weight: bold;
310 }
311 .close:hover,
312 .close:focus {
313 color: black;
314 text-decoration: none;
315 cursor: pointer;
316 }
317 .metrics-guide h3 {
318 margin-top: 20px;
319 }
320 .metrics-guide p {
321 margin: 5px 0;
322 }
323 .metrics-guide ul {
324 margin: 10px 0;
325 padding-left: 20px;
326 }
327 </style>
328 """
329 modal_js = """
330 <script>
331 document.addEventListener("DOMContentLoaded", function() {
332 var modal = document.getElementById("metricsHelpModal");
333 var openBtn = document.getElementById("openMetricsHelp");
334 var span = document.getElementsByClassName("close")[0];
335 if (openBtn && modal) {
336 openBtn.onclick = function() {
337 modal.style.display = "block";
338 };
339 }
340 if (span && modal) {
341 span.onclick = function() {
342 modal.style.display = "none";
343 };
344 }
345 window.onclick = function(event) {
346 if (event.target == modal) {
347 modal.style.display = "none";
348 }
349 }
350 });
351 </script>
352 """
353 return modal_css + modal_html + modal_js