2110511008/python-sql-2110511008
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

layout fix again

Browse Source
This commit is contained in:
Jesselyn Mu
2025-01-30 21:51:56 +07:00
parent 1ea0ebced9
commit 49f1f93bd9
1 changed files with 32 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
pages/prediction.py
View File

@ -463,37 +463,40 @@ def show_prediction():
with col1: with col1:
# st.image(buf, caption="SHAP Waterfall Plot", use_container_width=True) # st.image(buf, caption="SHAP Waterfall Plot", use_container_width=True)
# Tambahkan CSS styling ke HTML
st.markdown( st.markdown(
f""" """
<style> <style>
.shap-container {{ .shap-container {
display: flex; display: flex;
justify-content: center; justify-content: center;
}} align-items: center;
.shap-image {{ margin-top: 10px;
border-radius: 10px; /* Biar sudutnya membulat */ }
box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2); /* Shadow */ .shap-image {
border: 2px solid #ddd; /* Stroke */ border-radius: 10px; /* Sudut membulat */
padding: 5px; /* Ruang di dalam border */ box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2); /* Shadow */
background: white; /* Biar keliatan efeknya */ border: 2px solid #ddd; /* Stroke */
max-width: 100%; /* Biar responsif */ padding: 5px; /* Ruang di dalam border */
}} background: white; /* Biar keliatan efeknya */
.shap-caption {{ max-width: 100%; /* Biar responsif */
text-align: center; }
font-size: 14px; .shap-caption {
font-family: 'Poppins', sans-serif; text-align: center;
color: #555; font-size: 14px;
margin-top: 5px; font-family: 'Poppins', sans-serif;
}} color: #555;
</style> margin-top: 5px;
<div class="shap-container"> }
<img class="shap-image" src="data:image/png;base64,{buf.getvalue().decode('utf-8')}" alt="SHAP Waterfall Plot"> </style>
</div> """,
<p class="shap-caption">SHAP Waterfall Plot</p> unsafe_allow_html=True
""", )
unsafe_allow_html=True
)
# Gunakan `st.image()` untuk menampilkan gambar SHAP dari `buf`
st.markdown('<div class="shap-container">', unsafe_allow_html=True)
st.image(buf, caption="SHAP Waterfall Plot", use_container_width=True)
st.markdown('</div>', unsafe_allow_html=True)
with col2: with col2:
top_factors = sorted(shap_dict.items(), key=lambda x: abs(x[1]), reverse=True)[:5] top_factors = sorted(shap_dict.items(), key=lambda x: abs(x[1]), reverse=True)[:5]