Update app.py

app.py

@@ -1476,7 +1476,10 @@ else:
                     showarrow=False,
                     font_size=16
                 )
-                fig.update_layout(height=350, title=dict(text=title, x=0.4, xanchor='center'))
+                fig.update_layout(
+                    height=350,
+                    title=dict(text=title, x=0.5, xanchor='center')  # ← Ini wajib
+                )
                 return fig
 
             data_sorted = data.sort_values('weekly_avg', ascending=False)
@@ -1508,10 +1511,7 @@ else:
             bar_trace = go.Bar(
                 x=data_sorted[col_operator].astype(str),
                 y=data_sorted["weekly_avg"],
-                marker=dict(
-                    color=colors,
-                    line=dict(width=2, color="rgba(0,0,0,0.2)")
-                ),
+                marker=dict(color=colors, line=dict(width=2, color="rgba(0,0,0,0.2)")),
                 text=[f"{v:.1f}" for v in data_sorted["weekly_avg"]],
                 textposition="outside",
                 hovertemplate=(
@@ -1527,7 +1527,7 @@ else:
 
             fig = go.Figure(bar_trace)
             fig.update_layout(
-                title=dict(text=f"<b>{title}</b>", x=0.5),
+                title=dict(text=f"<b>{title}</b>", x=0.5, xanchor='center'),  # ← Ini wajib
                 height=450,
                 margin=dict(l=50, r=20, t=60, b=120),
                 xaxis_title="<b>Operator Name</b>",
@@ -1548,15 +1548,17 @@ else:
         # ===============================================================
         col1, col2 = st.columns(2)
         with col1:
-            # Center-align chart
-            st.markdown("<div style='display: flex; justify-content: center;'>", unsafe_allow_html=True)
-            st.plotly_chart(plot_chart(top_ob, "OB HAULER Operator Hazard Profile"), use_container_width=False, config={'displayModeBar': False})
-            st.markdown("</div>", unsafe_allow_html=True)
+            st.plotly_chart(
+                plot_chart(top_ob, "OB HAULER Operator Hazard Profile"),
+                use_container_width=True,  # ← Ini penting!
+                config={'displayModeBar': False}
+            )
         with col2:
-            # Center-align chart
-            st.markdown("<div style='display: flex; justify-content: center;'>", unsafe_allow_html=True)
-            st.plotly_chart(plot_chart(top_coal, "COAL HAULING Operator Hazard Profile"), use_container_width=False, config={'displayModeBar': False})
-            st.markdown("</div>", unsafe_allow_html=True)
+            st.plotly_chart(
+                plot_chart(top_coal, "COAL HAULING Operator Hazard Profile"),
+                use_container_width=True,  # ← Ini penting!
+                config={'displayModeBar': False}
+            )
         # ===============================================================
         # AI INSIGHTS — DIPERBAIKI: Risk Summary jadi 1 box + 3 list
         # ===============================================================