Update app.py

app.py

@@ -324,10 +324,43 @@ def predict_with_model(image, model_data):
             'error': str(e)
         }
 
-def analizar_lesion(img):
-    """Análisis principal de la lesión"""
-    if img is None:
-        return "<h3>❌ Error</h3><p>Por favor, carga una imagen para analizar.</p>"
+def create_probability_chart(predictions, consensus_class):
+    """Crear gráfico de barras con probabilidades"""
+    try:
+        fig, (ax1, ax2) = plt.subplots(1, 2, figsize=(15, 6))
+        
+        # Gráfico 1: Probabilidades por clase (consenso)
+        if predictions:
+            # Obtener probabilidades promedio
+            avg_probs = np.zeros(7)
+            for pred in predictions:
+                avg_probs += pred['probabilities']
+            avg_probs /= len(predictions)
+            
+            colors = ['#ff6b35' if i in MALIGNANT_INDICES else '#44ff44' for i in range(7)]
+            bars = ax1.bar(range(7), avg_probs, color=colors, alpha=0.8)
+            
+            # Destacar la clase consenso
+            consensus_idx = CLASSES.index(consensus_class)
+            bars[consensus_idx].set_color('#2196F3')
+            bars[consensus_idx].set_linewidth(3)
+            bars[consensus_idx].set_edgecolor('black')
+            
+            ax1.set_xlabel('Tipos de Lesión')
+            ax1.set_ylabel('Probabilidad Promedio')
+            ax1.set_title('📊 Distribución de Probabilidades por Clase')
+            ax1.set_xticks(range(7))
+            ax1.set_xticklabels([cls.split('(')[1].rstrip(')') for cls in CLASSES], rotation=45)
+            ax1.grid(True, alpha=0.3)
+            
+            # Añadir valores en las barras
+            for i, bar in enumerate(bars):
+                height = bar.get_height()
+                ax1.text(bar.get_x() + bar.get_width()/2., height + 0.01,
+                        f'{height:.2%}', ha='center', va='bottom', fontsize=9)
+        
+        # Gráfico 2: Confianza por modelo
+        model_names = [pre
     
     try:
         # Convertir a RGB si es necesario
@@ -369,51 +402,114 @@ def analizar_lesion(img):
         is_malignant = consensus_idx in MALIGNANT_INDICES
         risk_info = RISK_LEVELS[consensus_idx]
         
-        # Generar HTML del reporte
+        # Generar visualizaciones
+        probability_chart = create_probability_chart(predictions, consensus_class)
+        heatmap = create_heatmap(predictions)
+        
+        # Generar HTML del reporte COMPLETO
         html_report = f"""
-        <div style="font-family: Arial, sans-serif; max-width: 800px; margin: 0 auto;">
-            <h2 style="color: #2c3e50; text-align: center;">🏥 Análisis de Lesión Cutánea</h2>
+        <div style="font-family: Arial, sans-serif; max-width: 1200px; margin: 0 auto;">
+            <h2 style="color: #2c3e50; text-align: center;">🏥 Análisis Completo de Lesión Cutánea</h2>
             
             <div style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: white; padding: 20px; border-radius: 10px; margin: 20px 0;">
-                <h3 style="margin: 0; text-align: center;">📋 Resultado Principal</h3>
+                <h3 style="margin: 0; text-align: center;">📋 Resultado de Consenso</h3>
                 <p style="font-size: 18px; text-align: center; margin: 10px 0;"><strong>{consensus_class}</strong></p>
-                <p style="text-align: center; margin: 5px 0;">Confianza: <strong>{avg_confidence:.1%}</strong></p>
+                <p style="text-align: center; margin: 5px 0;">Confianza Promedio: <strong>{avg_confidence:.1%}</strong></p>
+                <p style="text-align: center; margin: 5px 0;">Consenso: <strong>{class_votes[consensus_class]}/{len(predictions)} modelos</strong></p>
             </div>
             
             <div style="background: {risk_info['color']}; color: white; padding: 15px; border-radius: 8px; margin: 15px 0;">
                 <h4 style="margin: 0;">⚠️ Nivel de Riesgo: {risk_info['level']}</h4>
                 <p style="margin: 5px 0;"><strong>{risk_info['urgency']}</strong></p>
-            </div>
-            
-            <div style="background: #f8f9fa; padding: 15px; border-radius: 8px; margin: 15px 0;">
-                <h4 style="color: #495057;">📊 Detalles del Análisis</h4>
-                <p><strong>Modelos consultados:</strong> {len(predictions)}</p>
-                <p><strong>Consenso:</strong> {class_votes[consensus_class]}/{len(predictions)} modelos</p>
-                <p><strong>Tipo:</strong> {'🔴 Potencialmente maligna' if is_malignant else '🟢 Probablemente benigna'}</p>
+                <p style="margin: 5px 0;">Tipo: {'🔴 Potencialmente maligna' if is_malignant else '🟢 Probablemente benigna'}</p>
             </div>
             
             <div style="background: #e3f2fd; padding: 15px; border-radius: 8px; margin: 15px 0;">
-                <h4 style="color: #1976d2;">🤖 Predicciones Individuales</h4>
+                <h4 style="color: #1976d2;">🤖 Resultados Individuales por Modelo</h4>
         """
         
-        for pred in predictions:
-            status_icon = "✅" if pred['success'] else "❌"
-            html_report += f"""
-                <div style="margin: 10px 0; padding: 10px; background: white; border-radius: 5px; border-left: 4px solid #1976d2;">
-                    <strong>{status_icon} {pred['model']}</strong><br>
-                    Diagnóstico: {pred['class']}<br>
-                    Confianza: {pred['confidence']:.1%}
+        # RESULTADOS INDIVIDUALES DETALLADOS
+        for i, pred in enumerate(predictions, 1):
+            if pred['success']:
+                model_risk = RISK_LEVELS[pred['predicted_idx']]
+                malignant_status = "🔴 Maligna" if pred['is_malignant'] else "🟢 Benigna"
+                
+                html_report += f"""
+                <div style="margin: 15px 0; padding: 15px; background: white; border-radius: 8px; border-left: 5px solid {'#ff6b35' if pred['is_malignant'] else '#44ff44'}; box-shadow: 0 2px 4px rgba(0,0,0,0.1);">
+                    <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;">
+                        <h5 style="margin: 0; color: #333;">#{i}. {pred['model']}</h5>
+                        <span style="background: {model_risk['color']}; color: white; padding: 4px 8px; border-radius: 4px; font-size: 12px;">{model_risk['level']}</span>
+                    </div>
+                    
+                    <div style="display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; font-size: 14px;">
+                        <div><strong>Diagnóstico:</strong><br>{pred['class']}</div>
+                        <div><strong>Confianza:</strong><br>{pred['confidence']:.1%}</div>
+                        <div><strong>Clasificación:</strong><br>{malignant_status}</div>
+                    </div>
+                    
+                    <div style="margin-top: 10px;">
+                        <strong>Top 3 Probabilidades:</strong><br>
+                        <div style="font-size: 12px; color: #666;">
+                """
+                
+                # Top 3 probabilidades para este modelo
+                top_indices = np.argsort(pred['probabilities'])[-3:][::-1]
+                for idx in top_indices:
+                    prob = pred['probabilities'][idx]
+                    if prob > 0.01:  # Solo mostrar si > 1%
+                        html_report += f"• {CLASSES[idx].split('(')[1].rstrip(')')}: {prob:.1%}<br>"
+                
+                html_report += f"""
+                        </div>
+                        <div style="margin-top: 8px; font-size: 12px; color: #888;">
+                            <strong>Recomendación:</strong> {model_risk['urgency']}
+                        </div>
+                    </div>
                 </div>
-            """
+                """
+            else:
+                html_report += f"""
+                <div style="margin: 10px 0; padding: 10px; background: #ffebee; border-radius: 5px; border-left: 4px solid #f44336;">
+                    <strong>❌ {pred['model']}</strong><br>
+                    <span style="color: #d32f2f;">Error: {pred.get('error', 'Desconocido')}</span>
+                </div>
+                """
         
         html_report += f"""
             </div>
             
+            <div style="background: #f8f9fa; padding: 15px; border-radius: 8px; margin: 15px 0;">
+                <h4 style="color: #495057;">📊 Análisis Estadístico</h4>
+                <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 15px;">
+                    <div>
+                        <strong>Modelos Activos:</strong> {len([p for p in predictions if p['success']])}/{len(predictions)}<br>
+                        <strong>Acuerdo Total:</strong> {class_votes[consensus_class]}/{len([p for p in predictions if p['success']])}<br>
+                        <strong>Confianza Máxima:</strong> {max([p['confidence'] for p in predictions if p['success']]):.1%}
+                    </div>
+                    <div>
+                        <strong>Diagnósticos Malignos:</strong> {len([p for p in predictions if p.get('success') and p.get('is_malignant')])}<br>
+                        <strong>Diagnósticos Benignos:</strong> {len([p for p in predictions if p.get('success') and not p.get('is_malignant')])}<br>
+                        <strong>Consenso Maligno:</strong> {'Sí' if is_malignant else 'No'}
+                    </div>
+                </div>
+            </div>
+            
+            <div style="background: #ffffff; padding: 15px; border-radius: 8px; margin: 15px 0; border: 1px solid #ddd;">
+                <h4 style="color: #333;">📈 Gráficos de Análisis</h4>
+                {probability_chart}
+            </div>
+            
+            <div style="background: #ffffff; padding: 15px; border-radius: 8px; margin: 15px 0; border: 1px solid #ddd;">
+                <h4 style="color: #333;">🔥 Mapa de Calor de Probabilidades</h4>
+                {heatmap}
+            </div>
+            
             <div style="background: #fff3e0; padding: 15px; border-radius: 8px; margin: 15px 0; border: 1px solid #ff9800;">
                 <h4 style="color: #f57c00;">⚠️ Advertencia Médica</h4>
-                <p style="margin: 5px 0;">Este análisis es solo una herramienta de apoyo diagnóstico.</p>
+                <p style="margin: 5px 0;">Este análisis es solo una herramienta de apoyo diagnóstico basada en IA.</p>
                 <p style="margin: 5px 0;"><strong>Siempre consulte con un dermatólogo profesional para un diagnóstico definitivo.</strong></p>
                 <p style="margin: 5px 0;">No utilice esta información como único criterio para decisiones médicas.</p>
+                <p style="margin: 5px 0;"><em>Los resultados individuales de cada modelo se muestran para transparencia y análisis comparativo.</em></p>
             </div>
         </div>
         """