Improve GSM capacity charts

apps/kpi_analysis/gsm_capacity.py

@@ -137,7 +137,12 @@ if (
         final_comments_df = (
             gsm_analysis_df.groupby("Final comment").size().reset_index(name="count")
         )
-        fig = px.bar(final_comments_df, x="Final comment", y="count")
+        fig = px.bar(
+            final_comments_df,
+            x="Final comment",
+            y="count",
+            title="Final comment distribution",
+        )
         fig.update_layout(height=1000)
         fig.update_traces(texttemplate="%{value}", textposition="outside")
         st.plotly_chart(fig, use_container_width=True)
@@ -149,31 +154,90 @@ if (
             .size()
             .reset_index(name="count")
         )
-        fig = px.bar(final_comments_summary_df, x="Final comment summary", y="count")
-        fig.update_layout(height=1000)
-        fig.update_traces(texttemplate="%{value}", textposition="outside")
-        st.plotly_chart(fig, use_container_width=True)
-        st.write(final_comments_summary_df)
+        # Add Pie chart with "Final comment summary" distribution in gsm_analysis_df in 2 columns
+        st.markdown("***")
+        st.markdown(":blue[**Final comment summary distribution**]")
+        final_comments_summary_col1, final_comments_summary_col2 = st.columns((1, 3))
+        with final_comments_summary_col1:
+            st.write(final_comments_summary_df)
+        with final_comments_summary_col2:
+            fig = px.pie(
+                final_comments_summary_df,
+                names="Final comment summary",
+                values="count",
+                hover_name="Final comment summary",
+                hover_data=["count"],
+                title="GSM Analysis comment distribution",
+            )
+            fig.update_layout(height=800)
+            fig.update_traces(
+                texttemplate="%{label}: %{value}",
+                textfont_size=15,
+                textposition="outside",
+            )
+            st.plotly_chart(fig, use_container_width=True)
 
         # Add dataframe and ploty bar chart with "BH Congestion status" distribution in gsm_analysis_df in 2 columns
+        st.markdown("***")
+        st.markdown(":blue[**BH Congestion status distribution**]")
         bh_congestion_status_df = (
             gsm_analysis_df.groupby("BH Congestion status")
             .size()
             .reset_index(name="count")
         )
-        fig = px.bar(bh_congestion_status_df, x="BH Congestion status", y="count")
-        fig.update_layout(height=800)
-        fig.update_traces(texttemplate="%{value}", textposition="outside")
-        st.plotly_chart(fig, use_container_width=True)
-        st.write(bh_congestion_status_df)
-        # Add dataframe and ploty bar chart with "operational_comment" distribution in gsm_analysis_df in 2 columns
+        # Replace "" cell in "BH Congestion status" with "No Congestion"
+        bh_congestion_status_df["BH Congestion status"] = bh_congestion_status_df[
+            "BH Congestion status"
+        ].replace("", "No Congestion")
+        # Replace "nan, nan" cell in "BH Congestion status" with "No KPI"
+        bh_congestion_status_df["BH Congestion status"] = bh_congestion_status_df[
+            "BH Congestion status"
+        ].replace("nan, nan", "No KPI")
+
+        bh_congestion_status_col1, bh_congestion_status_col2 = st.columns((2, 1))
+        with bh_congestion_status_col2:
+            st.write(bh_congestion_status_df)
+        with bh_congestion_status_col1:
+            fig = px.pie(
+                bh_congestion_status_df,
+                names="BH Congestion status",
+                values="count",
+                hover_name="BH Congestion status",
+                hover_data=["count"],
+                title="BH Congestion status distribution",
+            )
+            fig.update_layout(height=800)
+            fig.update_traces(
+                texttemplate="%{label}: %{value}",
+                textfont_size=15,
+                textposition="outside",
+            )
+            st.plotly_chart(fig, use_container_width=True)
+
+        # Add dataframe and ploty pie chart with "operational_comment" distribution in gsm_analysis_df in 2 columns
+        st.markdown("***")
+        st.markdown(":blue[**Operational comments distribution**]")
         operational_comments_df = (
             gsm_analysis_df.groupby("operational_comment")
             .size()
             .reset_index(name="count")
         )
-        fig = px.bar(operational_comments_df, x="operational_comment", y="count")
-        fig.update_layout(height=600)
-        fig.update_traces(texttemplate="%{value}", textposition="outside")
-        st.plotly_chart(fig, use_container_width=True)
-        st.write(operational_comments_df)
+        operational_comments_col1, operational_comments_col2 = st.columns((1, 2))
+        with operational_comments_col1:
+            st.write(operational_comments_df)
+        with operational_comments_col2:
+            fig = px.pie(
+                operational_comments_df,
+                names="operational_comment",
+                values="count",
+                hover_name="operational_comment",
+                hover_data=["count"],
+                title="Operational comments distribution",
+            )
+            fig.update_layout(height=600)
+            fig.update_traces(
+                texttemplate="%{label}: %{value}",
+                textfont_size=15,
+                textposition="outside",
+            )
+            st.plotly_chart(fig, use_container_width=True)