Slides adjust

thesis_output/presentation/charts.js

@@ -89,43 +89,58 @@ function createTrialsChart() {
   });
 }
 
-function createTextlineChart() {
+function createImpactChart() {
-  const ctx = document.getElementById('chartTextline');
+  const ctx = document.getElementById('chartImpact');
-  if (!ctx || charts.textline) return;
+  if (!ctx || charts.impact) return;
-  charts.textline = new Chart(ctx, {
+  const params = [
+    'use_doc_unwarping',
+    'textline_orientation',
+    'use_doc_orient_classify',
+    'text_det_thresh',
+    'text_det_box_thresh',
+    'text_rec_score_thresh'
+  ];
+  const correlations = [0.879, -0.535, -0.712, 0.428, 0.311, -0.268];
+  const absValues = correlations.map(Math.abs);
+  // Sort by absolute value descending
+  const indices = absValues.map((_, i) => i).sort((a, b) => absValues[b] - absValues[a]);
+  const sortedParams = indices.map(i => params[i]);
+  const sortedCorr = indices.map(i => correlations[i]);
+  const colors = sortedCorr.map(v => v > 0 ? RED : BLUE);
+  const borderColors = sortedCorr.map(v => v > 0 ? '#C04030' : BLUE_DARK);
+
+  charts.impact = new Chart(ctx, {
     type: 'bar',
     data: {
-      labels: ['False', 'True'],
+      labels: sortedParams,
       datasets: [{
-        label: 'CER medio (%)',
+        data: sortedCorr,
-        data: [4.73, 1.74],
+        backgroundColor: colors,
-        backgroundColor: [GRAY, BLUE],
+        borderColor: borderColors,
-        borderColor: ['#aaa', BLUE_DARK],
+        borderWidth: 1.5,
-        borderWidth: 2,
+        borderRadius: 4,
-        borderRadius: 8,
+        barPercentage: 0.65
-        barPercentage: 0.5
       }]
     },
     options: {
       ...commonOptions,
+      indexAxis: 'y',
       scales: {
-        y: {
-          beginAtZero: true,
-          max: 6,
-          title: { display: true, text: 'CER (%)', font: { family: 'Calibri', size: 13 } },
-          grid: { color: '#f0f0f0' }
-        },
         x: {
-          title: { display: true, text: 'textline_orientation', font: { family: 'Calibri', size: 13, weight: 'bold' } },
+          min: -1, max: 1,
+          title: { display: true, text: 'Correlación con CER (rojo = perjudica, azul = mejora)', font: { family: 'Calibri', size: 10 } },
+          grid: { color: (ctx) => ctx.tick.value === 0 ? '#666' : '#f0f0f0' }
+        },
+        y: {
           grid: { display: false },
-          ticks: { font: { family: 'Calibri', size: 16, weight: 'bold' } }
+          ticks: { font: { family: 'Consolas, monospace', size: 11 } }
         }
       },
       plugins: {
         legend: { display: false },
         tooltip: {
           callbacks: {
-            label: (ctx) => `CER: ${ctx.parsed.y}%`
+            label: (ctx) => `Correlación: ${ctx.parsed.x > 0 ? '+' : ''}${ctx.parsed.x.toFixed(3)}`
           }
         }
       }
@@ -321,7 +336,7 @@ function createGPUChart() {
 const chartCreators = {
   benchmark: createBenchmarkChart,
   trials: createTrialsChart,
-  textline: createTextlineChart,
+  impact: createImpactChart,
   correlations: () => { createCorrelationChart(); createImportanceChart(); },
   validation: createValidationChart,
   gpu: createGPUChart

thesis_output/presentation/slides/09_search_space.html

@@ -16,15 +16,15 @@
       </table>
       <div style="display: flex; gap: 8px; margin-top: 8px; font-size: 0.5em;">
         <div style="flex:1; background: #FFF3E0; border-radius: 6px; padding: 6px 10px; line-height: 1.35;">
-          <strong style="color:#E65100;">Discretos / Booleanos (3)</strong> — <span style="color:#E65100; font-weight: 700;">True | False</span><br>
+          <strong style="color:#E65100;">Discretos / Booleanos (3):</strong> <span style="color:#E65100; font-weight: 700;">True | False</span><br>
           Solo <strong>2 valores</strong> por parámetro (8 combinaciones). Interruptores on/off de módulos del pipeline. Decisiones <em>arquitecturales</em>: cambian <strong>qué</strong> se ejecuta.
         </div>
         <div style="flex:1; background: #E8F5E9; border-radius: 6px; padding: 6px 10px; line-height: 1.35;">
-          <strong style="color:#2E7D32;">Continuos / Float (3)</strong> — <span style="color:#2E7D32; font-weight: 700;">0.01 ← → 0.99</span><br>
+          <strong style="color:#2E7D32;">Continuos / Float (3):</strong> <span style="color:#2E7D32; font-weight: 700;">0.01 ← → 0.99</span><br>
           Valores reales muestreados uniformemente. <strong>Infinitos valores</strong>, grid search inviable. Ajustan <em>sensibilidad</em> de detección y reconocimiento.
         </div>
         <div style="flex:0.5; background: var(--unir-gray); border-radius: 6px; padding: 6px 10px; line-height: 1.35;">
-          <strong style="color:#888;">Fijo (1)</strong> — <span style="color:#888; font-weight: 700;">0.0</span><br>
+          <strong style="color:#888;">Fijo (1):</strong> <span style="color:#888; font-weight: 700;">0.0</span><br>
           Constante en todos los trials. Trabajo futuro.
         </div>
       </div>

thesis_output/presentation/slides/12_key_finding.html

@@ -1,20 +1,23 @@
-<section data-chart="textline">
+<section data-chart="impact">
-  <h2>Hallazgo Clave: <code>textline_orientation</code></h2>
+  <h2>Hallazgo: Jerarquía de Impacto de Hiperparámetros</h2>
   <div class="two-columns">
     <div class="chart-container">
-      <canvas id="chartTextline"></canvas>
+      <canvas id="chartImpact"></canvas>
     </div>
     <div>
-      <div class="metric-card" style="width:100%; margin-bottom: 15px;">
+      <div class="metric-card" style="width:100%; margin-bottom: 12px;">
-        <div class="number success" style="font-size: 2em;">-63.2%</div>
+        <div class="number success" style="font-size: 1.8em;">6 parámetros</div>
-        <div class="label" style="font-size:0.75em;">Reducción en CER</div>
+        <div class="label" style="font-size:0.7em;">contribuyen al resultado óptimo</div>
       </div>
       <ul class="compact-list">
-        <li>Un <strong>único parámetro booleano</strong> tiene mayor impacto que todos los umbrales numéricos combinados</li>
+        <li><strong><code>use_doc_unwarping</code></strong> (correlación +0.88): activarlo <strong>perjudica</strong> en PDFs digitales</li>
-        <li><strong>Decisiones arquitecturales</strong> &gt; ajustes numéricos finos</li>
+        <li><strong><code>use_doc_orient_classify</code></strong> (correlación -0.71): mejora la orientación en documentos complejos</li>
-        <li>Crítico para documentos con <strong>layouts complejos</strong> (índices, listas, encabezados)</li>
+        <li><strong><code>textline_orientation</code></strong> (correlación -0.54): crítico para layouts mixtos</li>
-        <li>52 de 64 trials (81%) lo activaron automáticamente (Optuna aprendió rápido)</li>
+        <li><strong>Umbrales numéricos</strong> aportan ajuste fino adicional (hasta -0.43 correlación)</li>
       </ul>
+      <div class="highlight-box" style="font-size:0.60em; margin-top:10px;">
+        <strong>Conclusión:</strong> Sin búsqueda sistemática de 64 trials, estas interacciones entre parámetros permanecerían desconocidas. La optimización conjunta es lo que logra CER &lt; 1%.
+      </div>
     </div>
   </div>
 </section>

thesis_output/presentation/slides/16_optimal_config.html

@@ -17,7 +17,7 @@
     <div>
       <h3 style="font-size:0.8em;">Insights clave</h3>
       <ul class="compact-list">
-        <li class="fragment fade-up"><strong><code>textline_orientation = True</code></strong>: Parámetro más impactante (-63.2% CER)</li>
+        <li class="fragment fade-up"><strong>Optimización conjunta</strong>: la búsqueda sistemática identificó interacciones críticas entre 6 parámetros</li>
         <li class="fragment fade-up"><strong><code>use_doc_unwarping = False</code></strong>: Procesamiento innecesario para PDFs digitales</li>
         <li class="fragment fade-up"><strong><code>text_det_thresh</code> bajo</strong>: Captura más regiones de texto, reduce omisiones</li>
         <li class="fragment fade-up"><strong>Parámetros booleanos</strong> dominan sobre umbrales numéricos</li>