Update templates/index.html

templates/index.html

@@ -117,9 +117,15 @@
         <div id="sankey-graph">
             {% if sankey_graph %}
               <h2>Gráfico de Sankey</h2>
-              <p>Este gráfico muestra la relación entre comentarios, indicando la transición de particular a general. Las flechas bidireccionales reflejan las conexiones entre categorías.</p>
-              <div>{{ sankey_graph | safe }}</div>
-{% endif %}
+              <div style="position: relative; display: inline-block; text-align: center;">
+                  <img src="{{ url_for('static', filename='bidirectional_arrows.png') }}" 
+                       alt="Flechas Bidireccionales" 
+                       style="position: absolute; top: -50px; left: 50%; transform: translateX(-50%); width: 30%; max-width: 400px; z-index: 1;">
+                  <div style="position: relative; z-index: 0;">
+                      {{ sankey_graph | safe }}
+                  </div>
+              </div>
+            {% endif %}
         </div>
     </div>
 </body>