Update app.py

app.py

@@ -563,164 +563,347 @@ st.markdown(f"""
 #         </div>
 #     </div>
 #     """, unsafe_allow_html=True)
-import pandas as pd
-import plotly.express as px
-import streamlit as st
+# import pandas as pd
+# import plotly.express as px
+# import streamlit as st
+
+# # Judul Objective 2 — Center-aligned, elegant box-style (kanan atas kotak)
+# st.markdown('''
+# <div style="text-align: center; margin-bottom: 16px;">
+#   <div style="
+#     background-color: #2C2C2C; 
+#     color: white; 
+#     padding: 10px 16px; 
+#     display: inline-block; 
+#     border-radius: 6px;
+#     font-weight: 600;
+#     position: relative;
+#     top: 0; right: 0;
+#   ">
+#     OBJECTIVE 2: Hourly Data Capture vs Alarm Count Analysis
+#   </div>
+# </div>
+# ''', unsafe_allow_html=True)
 
-# Judul Objective 2 — Center-aligned, elegant box-style (kanan atas kotak)
-st.markdown('''
-<div style="text-align: center; margin-bottom: 16px;">
-  <div style="
-    background-color: #2C2C2C; 
-    color: white; 
-    padding: 10px 16px; 
-    display: inline-block; 
-    border-radius: 6px;
-    font-weight: 600;
-    position: relative;
-    top: 0; right: 0;
-  ">
-    OBJECTIVE 2: Hourly Data Capture vs Alarm Count Analysis
-  </div>
-</div>
-''', unsafe_allow_html=True)
+# col1, col2 = st.columns(2)
 
-col1, col2 = st.columns(2)
+# # =============== COL 1: Capture Data per Jam per Tyre ===============
+# with col1:
+#     st.markdown('<h5 style="text-align:center; margin-top: 0;">Data Capture per Hour by Tyre Position</h5>', unsafe_allow_html=True)
 
-# =============== COL 1: Capture Data per Jam per Tyre ===============
-with col1:
-    st.markdown('<h5 style="text-align:center; margin-top: 0;">Data Capture per Hour by Tyre Position</h5>', unsafe_allow_html=True)
+#     # Hitung jumlah data capture per jam dan per posisi (semua data, bukan hanya alarm)
+#     capture_data = dff.copy()
+#     hourly_capture_counts = capture_data.groupby(['hour', 'Position']).size().unstack(fill_value=0)
 
-    # Hitung jumlah data capture per jam dan per posisi (semua data, bukan hanya alarm)
-    capture_data = dff.copy()
-    hourly_capture_counts = capture_data.groupby(['hour', 'Position']).size().unstack(fill_value=0)
+#     # Pastikan semua posisi (1,2,3,4) ada
+#     for pos in [1, 2, 3, 4]:
+#         if pos not in hourly_capture_counts.columns:
+#             hourly_capture_counts[pos] = 0
 
-    # Pastikan semua posisi (1,2,3,4) ada
-    for pos in [1, 2, 3, 4]:
-        if pos not in hourly_capture_counts.columns:
-            hourly_capture_counts[pos] = 0
+#     hourly_capture_counts = hourly_capture_counts[[1, 2, 3, 4]].copy()
 
-    hourly_capture_counts = hourly_capture_counts[[1, 2, 3, 4]].copy()
+#     # Melt data untuk plotting
+#     hourly_capture_melted = hourly_capture_counts.reset_index().melt(
+#         id_vars='hour',
+#         value_vars=[1, 2, 3, 4],
+#         var_name='Position',
+#         value_name='Capture Count'
+#     )
+#     hourly_capture_melted['Position'] = hourly_capture_melted['Position'].astype(str)
+
+#     # Warna sesuai preferensi
+#     color_map = {
+#         '1': '#003DA5',   # Dark blue
+#         '2': '#7FA6E8',   # Light blue
+#         '3': '#FFB300',   # Amber (PLN yellow)
+#         '4': '#FFE082'    # Light amber
+#     }
+
+#     fig1 = px.line(
+#         hourly_capture_melted,
+#         x='hour',
+#         y='Capture Count',
+#         color='Position',
+#         color_discrete_map=color_map,
+#         title="Data Capture per Hour by Tyre Position",
+#         labels={'Capture Count': 'Number of Records', 'Position': 'Tyre Position'},
+#         line_shape='linear',
+#         template="plotly_white"
+#     )
 
-    # Melt data untuk plotting
-    hourly_capture_melted = hourly_capture_counts.reset_index().melt(
-        id_vars='hour',
-        value_vars=[1, 2, 3, 4],
-        var_name='Position',
-        value_name='Capture Count'
-    )
-    hourly_capture_melted['Position'] = hourly_capture_melted['Position'].astype(str)
-
-    # Warna sesuai preferensi
-    color_map = {
-        '1': '#003DA5',   # Dark blue
-        '2': '#7FA6E8',   # Light blue
-        '3': '#FFB300',   # Amber (PLN yellow)
-        '4': '#FFE082'    # Light amber
-    }
+#     fig1.update_layout(
+#         xaxis=dict(
+#             title="Hour of Day",
+#             tickmode='array',
+#             tickvals=list(range(0, 24)),
+#             ticktext=[f"{h:02d}:00" for h in range(24)],
+#             tickangle=45
+#         ),
+#         yaxis=dict(title="Number of Records"),
+#         legend_title_text='Tyre Position',
+#         margin=dict(t=40, b=40, l=40, r=20),
+#         title_x=0.5
+#     )
 
-    fig1 = px.line(
-        hourly_capture_melted,
-        x='hour',
-        y='Capture Count',
-        color='Position',
-        color_discrete_map=color_map,
-        title="Data Capture per Hour by Tyre Position",
-        labels={'Capture Count': 'Number of Records', 'Position': 'Tyre Position'},
-        line_shape='linear',
-        template="plotly_white"
-    )
+#     st.plotly_chart(fig1, use_container_width=True)
 
-    fig1.update_layout(
-        xaxis=dict(
-            title="Hour of Day",
-            tickmode='array',
-            tickvals=list(range(0, 24)),
-            ticktext=[f"{h:02d}:00" for h in range(24)],
-            tickangle=45
-        ),
-        yaxis=dict(title="Number of Records"),
-        legend_title_text='Tyre Position',
-        margin=dict(t=40, b=40, l=40, r=20),
-        title_x=0.5
-    )
+# # =============== COL 2: Count Alarm (Amber & Red Only) ===============
+# with col2:
+#     st.markdown('<h5 style="text-align:center; margin-top: 0;">Alarm Count (Amber & Red Only) per Hour by Tyre Position</h5>', unsafe_allow_html=True)
+
+#     # Filter hanya alarm Amber dan Red
+#     alarm_data = dff[dff['is_alarm'] == 1].copy()
+#     alarm_data = alarm_data[alarm_data['Alarm Status'].str.contains('Amber|Red', case=False, na=False)]
+
+#     if alarm_data.empty:
+#         st.warning("No Amber or Red alarm data to display.")
+#     else:
+#         # Hitung jumlah alarm per jam dan per posisi
+#         hourly_alarm_counts = alarm_data.groupby(['hour', 'Position']).size().unstack(fill_value=0)
+
+#         # Pastikan semua posisi (1,2,3,4) ada
+#         for pos in [1, 2, 3, 4]:
+#             if pos not in hourly_alarm_counts.columns:
+#                 hourly_alarm_counts[pos] = 0
+
+#         hourly_alarm_counts = hourly_alarm_counts[[1, 2, 3, 4]].copy()
+
+#         # Melt data untuk plotting
+#         hourly_alarm_melted = hourly_alarm_counts.reset_index().melt(
+#             id_vars='hour',
+#             value_vars=[1, 2, 3, 4],
+#             var_name='Position',
+#             value_name='Alarm Count'
+#         )
+#         hourly_alarm_melted['Position'] = hourly_alarm_melted['Position'].astype(str)
+
+#         fig2 = px.line(
+#             hourly_alarm_melted,
+#             x='hour',
+#             y='Alarm Count',
+#             color='Position',
+#             color_discrete_map=color_map,
+#             title="Alarm Count (Amber & Red Only) per Hour by Tyre Position",
+#             labels={'Alarm Count': 'Number of Alarms', 'Position': 'Tyre Position'},
+#             line_shape='linear',
+#             template="plotly_white"
+#         )
+
+#         fig2.update_layout(
+#             xaxis=dict(
+#                 title="Hour of Day",
+#                 tickmode='array',
+#                 tickvals=list(range(0, 24)),
+#                 ticktext=[f"{h:02d}:00" for h in range(24)],
+#                 tickangle=45
+#             ),
+#             yaxis=dict(title="Number of Alarms"),
+#             legend_title_text='Tyre Position',
+#             margin=dict(t=40, b=40, l=40, r=20),
+#             title_x=0.5
+#         )
+
+#         st.plotly_chart(fig2, use_container_width=True)
+
+# # =============== INSIGHT ===============
+# # Insight tetap bisa menampilkan perbandingan
+# capture_by_pos = dff['Position'].value_counts().reindex([1,2,3,4], fill_value=0)
+# alarm_by_pos = alarm_data['Position'].value_counts().reindex([1,2,3,4], fill_value=0)
+
+# insight_text = f"""
+# • Total data capture: Pos 1={capture_by_pos[1]}, 2={capture_by_pos[2]}, 3={capture_by_pos[3]}, 4={capture_by_pos[4]}
+# • Total alarms (Amber/Red): Pos 1={alarm_by_pos[1]}, 2={alarm_by_pos[2]}, 3={alarm_by_pos[3]}, 4={alarm_by_pos[4]}
+# • Alarm density varies significantly between positions — suggesting different operational stress levels.
+# """
+
+# st.markdown(f"""
+# <div class="insight-box">
+# <div class="content">
+# {insight_text.strip()}
+# </div>
+# </div>
+# """, unsafe_allow_html=True)
+st.markdown("""
+<h3 class="objective-title">OBJECTIVE 3: Alarm Frequency Analysis — When, Where, and Which Tyres Matter Most?</h3>
+<small>*Showing only Red High Pressure Alarms</small>
+""", unsafe_allow_html=True)
 
-    st.plotly_chart(fig1, use_container_width=True)
+# Filter hanya data alarm
+alarm_data = dff[dff['is_alarm'] == 1].copy()
 
-# =============== COL 2: Count Alarm (Amber & Red Only) ===============
-with col2:
-    st.markdown('<h5 style="text-align:center; margin-top: 0;">Alarm Count (Amber & Red Only) per Hour by Tyre Position</h5>', unsafe_allow_html=True)
+col_b, col_a = st.columns(2)
 
-    # Filter hanya alarm Amber dan Red
-    alarm_data = dff[dff['is_alarm'] == 1].copy()
-    alarm_data = alarm_data[alarm_data['Alarm Status'].str.contains('Amber|Red', case=False, na=False)]
+# =============== COL B: Donut Charts (Distribusi Alarm per Position) ===============
+with col_b:
+    st.markdown('<h5 style="text-align:center; margin-top: 0;">Alarm Distribution by Position</h5>', unsafe_allow_html=True)
 
     if alarm_data.empty:
-        st.warning("No Amber or Red alarm data to display.")
+        st.warning("No alarm data to display.")
     else:
-        # Hitung jumlah alarm per jam dan per posisi
-        hourly_alarm_counts = alarm_data.groupby(['hour', 'Position']).size().unstack(fill_value=0)
-
-        # Pastikan semua posisi (1,2,3,4) ada
-        for pos in [1, 2, 3, 4]:
-            if pos not in hourly_alarm_counts.columns:
-                hourly_alarm_counts[pos] = 0
-
-        hourly_alarm_counts = hourly_alarm_counts[[1, 2, 3, 4]].copy()
-
-        # Melt data untuk plotting
-        hourly_alarm_melted = hourly_alarm_counts.reset_index().melt(
-            id_vars='hour',
-            value_vars=[1, 2, 3, 4],
-            var_name='Position',
-            value_name='Alarm Count'
+        # Group alarm status
+        alarm_data['Alarm_Category'] = alarm_data['Alarm Status'].apply(
+            lambda x: 'No Alarm' if 'No Alarm' in x
+            else 'Amber Alarm' if 'Amber' in x
+            else 'Red Alarm'
         )
-        hourly_alarm_melted['Position'] = hourly_alarm_melted['Position'].astype(str)
-
-        fig2 = px.line(
-            hourly_alarm_melted,
-            x='hour',
-            y='Alarm Count',
-            color='Position',
-            color_discrete_map=color_map,
-            title="Alarm Count (Amber & Red Only) per Hour by Tyre Position",
-            labels={'Alarm Count': 'Number of Alarms', 'Position': 'Tyre Position'},
-            line_shape='linear',
-            template="plotly_white"
+
+        # Buat 4 donut chart
+        fig_donut = make_subplots(
+            rows=2, cols=2,
+            specs=[[{'type':'domain'}, {'type':'domain'}],
+                   [{'type':'domain'}, {'type':'domain'}]],
+            subplot_titles=['Position 1', 'Position 2', 'Position 3', 'Position 4']
         )
 
-        fig2.update_layout(
-            xaxis=dict(
-                title="Hour of Day",
-                tickmode='array',
-                tickvals=list(range(0, 24)),
-                ticktext=[f"{h:02d}:00" for h in range(24)],
-                tickangle=45
-            ),
-            yaxis=dict(title="Number of Alarms"),
-            legend_title_text='Tyre Position',
-            margin=dict(t=40, b=40, l=40, r=20),
-            title_x=0.5
+        for i, pos in enumerate([1, 2, 3, 4], 1):
+            pos_data = alarm_data[alarm_data['Position'] == pos]
+            if not pos_data.empty:
+                counts = pos_data['Alarm_Category'].value_counts()
+                labels = counts.index.tolist()
+                values = counts.values.tolist()
+
+                # Warna: Hijau (No), Kuning (Amber), Merah (Red)
+                colors = ['#2E7D32', '#FFC107', '#D32F2F']
+
+                fig_donut.add_trace(
+                    go.Pie(
+                        labels=labels,
+                        values=values,
+                        name=f'Position {pos}',
+                        hole=0.4,
+                        marker_colors=colors
+                    ),
+                    row=(i - 1) // 2 + 1,
+                    col=(i - 1) % 2 + 1
+                )
+
+        fig_donut.update_layout(
+            height=500,
+            showlegend=True,
+            margin=dict(t=40, b=20, l=20, r=20),
+            legend=dict(
+                orientation="h",
+                yanchor="bottom",
+                y=1.02,
+                xanchor="right",
+                x=1
+            )
         )
+        st.plotly_chart(fig_donut, use_container_width=True)
+
+# =============== COL A: Radial Charts (Count Alarm per Jam) ===============
+with col_a:
+    st.markdown('<h5 style="text-align:center; margin-top: 0;">Alarm Count by Hour (Radial)</h5>', unsafe_allow_html=True)
 
-        st.plotly_chart(fig2, use_container_width=True)
+    if alarm_data.empty:
+        st.warning("No alarm data to display.")
+    else:
+        # Ambil pressure max untuk warna gradasi
+        max_pressure = alarm_data['Pressure (psi)'].max()
+        min_pressure = alarm_data['Pressure (psi)'].min()
+
+        # Buat 4 radial chart
+        fig_radial = make_subplots(
+            rows=2, cols=2,
+            specs=[[{'type': 'polar'}, {'type': 'polar'}],
+                   [{'type': 'polar'}, {'type': 'polar'}]],
+            subplot_titles=['Front Position 1 (06:00–18:00)', 'Front Position 2 (18:00–06:00)',
+                            'Rear Position 3 (06:00–18:00)', 'Rear Position 4 (18:00–06:00)']
+        )
 
-# =============== INSIGHT ===============
-# Insight tetap bisa menampilkan perbandingan
-capture_by_pos = dff['Position'].value_counts().reindex([1,2,3,4], fill_value=0)
-alarm_by_pos = alarm_data['Position'].value_counts().reindex([1,2,3,4], fill_value=0)
+        for i, pos in enumerate([1, 2, 3, 4], 1):
+            pos_data = alarm_data[alarm_data['Position'] == pos].copy()
+            if not pos_data.empty:
+                # Kelompokkan jam berdasarkan periode
+                if i in [1, 3]:  # Pagi–sore
+                    pos_data = pos_data[pos_data['hour'].between(6, 17, inclusive='both')]
+                else:  # Sore–pagi
+                    pos_data = pos_data[~pos_data['hour'].between(6, 17, inclusive='both')]
+
+                if not pos_data.empty:
+                    hourly_counts = pos_data.groupby('hour').size().reindex(range(24), fill_value=0)
+                    if i in [1, 3]:  # 06:00–18:00
+                        hourly_counts = hourly_counts[6:18]
+                    else:  # 18:00���06:00
+                        hourly_counts = pd.concat([hourly_counts[18:], hourly_counts[:6]]).reindex(range(12), fill_value=0)
+
+                    # Warna berdasarkan rata-rata pressure
+                    avg_pressure_per_hour = pos_data.groupby('hour')['Pressure (psi)'].mean().reindex(hourly_counts.index, fill_value=0)
+                    colorscale = avg_pressure_per_hour
+
+                    fig_radial.add_trace(
+                        go.Barpolar(
+                            r=hourly_counts.values,
+                            theta=hourly_counts.index * 30,  # 12 jam * 30° = 360°
+                            name=f'Position {pos}',
+                            marker=dict(
+                                color=colorscale,
+                                colorscale='Reds',
+                                cmin=min_pressure,
+                                cmax=max_pressure
+                            ),
+                            opacity=0.8
+                        ),
+                        row=(i - 1) // 2 + 1,
+                        col=(i - 1) % 2 + 1
+                    )
 
-insight_text = f"""
-• Total data capture: Pos 1={capture_by_pos[1]}, 2={capture_by_pos[2]}, 3={capture_by_pos[3]}, 4={capture_by_pos[4]}
-• Total alarms (Amber/Red): Pos 1={alarm_by_pos[1]}, 2={alarm_by_pos[2]}, 3={alarm_by_pos[3]}, 4={alarm_by_pos[4]}
-• Alarm density varies significantly between positions — suggesting different operational stress levels.
-"""
+        fig_radial.update_layout(
+            height=600,
+            showlegend=False,
+            margin=dict(t=60, b=20, l=20, r=20)
+        )
+        st.plotly_chart(fig_radial, use_container_width=True)
+
+# =============== INSIGHT 3 ===============
+if alarm_data.empty:
+    insight_text = "• No alarm data available for analysis."
+else:
+    # Insight tetap sama
+    alarm_hours = alarm_data['hour']
+
+    def hour_to_band(h):
+        if 0 <= h < 6:   return "00:00–06:00 (Night)"
+        if 6 <= h < 12:  return "06:00–12:00 (Morning)"
+        if 12 <= h < 18: return "12:00–18:00 (Afternoon)"
+        return "18:00–00:00 (Evening)"
+
+    alarm_hours_df = pd.DataFrame({'hour': alarm_hours})
+    alarm_hours_df['band'] = alarm_hours_df['hour'].apply(hour_to_band)
+    band_counts = alarm_hours_df['band'].value_counts().sort_index()
+
+    top_bands = band_counts.nlargest(2)
+    dominant_band = top_bands.index[0] if len(top_bands) > 0 else "N/A"
+    second_dominant_band = top_bands.index[1] if len(top_bands) > 1 else "N/A"
+
+    dominant_pct = (top_bands.iloc[0] / band_counts.sum() * 100) if len(top_bands) > 0 else 0
+    second_pct = (top_bands.iloc[1] / band_counts.sum() * 100) if len(top_bands) > 1 else 0
+
+    front_alarms = alarm_data[alarm_data['Position'].isin([1, 2])].shape[0]
+    rear_alarms = alarm_data[alarm_data['Position'].isin([3, 4])].shape[0]
+    total_alarms = front_alarms + rear_alarms
+    front_pct = front_alarms / total_alarms * 100 if total_alarms > 0 else 0
+
+    top_zone = alarm_data['Zone'].value_counts().index[0] if not alarm_data.empty else "N/A"
+
+    insight_lines = [
+        f"• {dominant_band} is the dominant alarm period ({dominant_pct:.1f}% of all alarms).",
+        f"• {second_dominant_band} is the second-highest period ({second_pct:.1f}% of alarms)."
+    ]
+    if front_alarms > 0:
+        insight_lines.append(f"• Front tyres (Pos 1 & 2) account for {front_pct:.1f}% of all alarms, indicating higher stress or usage intensity upfront.")
+    if top_zone != "N/A":
+        insight_lines.append(f"• Zone {top_zone} records the highest alarm frequency across all positions.")
+    insight_lines.append("• Alarm clustering in specific hours and front positions suggests opportunity for targeted inspection scheduling.")
+
+    insight_text = "\n".join(insight_lines)
 
+# =============== DISPLAY INSIGHT ===============
 st.markdown(f"""
 <div class="insight-box">
-<div class="content">
-{insight_text.strip()}
-</div>
+    <div class="content">
+{insight_text}
+    </div>
 </div>
 """, unsafe_allow_html=True)
 # ================= OBJECTIVE 3 =================