Adding plotly plot

app.py

@@ -42,42 +42,62 @@ if remove_punct and input_str:
     translating = str.maketrans('', '', characters_to_remove)
     input_str = input_str.translate(translating)
 
-# Display the input text after processing
-st.write("Processed input:", input_str)
-
-# Predict and display the classification scores if input is provided
-if st.button("Classify"):
-    if input_str:
-        predictions = model_pipeline(input_str)
-        data = pd.DataFrame(predictions)
-        data=data.sort_values(by='score', ascending=True)
-        data.label = data.label.astype(str)
-
-        
-        # Displaying predictions as a bar chart
-        fig = go.Figure(
-            go.Bar(
-                x=data.score.values,
-                y=[f'{i}th Century' for i in data.label.values],
-                orientation='h', 
-                text=[f'{score:.3f}' for score in data['score'].values],  # Format text with 2 decimal points
-                textposition='outside',  # Position the text outside the bars
-                hoverinfo='text',  # Use custom text for hover info
-                hovertext=[f'{i}th Century<br>Score: {score:.3f}' for i, score in zip(data['label'], data['score'])],  # Custom hover text
-                marker=dict(color=[colors[i % len(colors)] for i in range(len(data))]),  # Cycle through colors
-
-            ))
-        fig.update_traces(width=0.4)
-
-        fig.update_layout(
-            height=300,  # Custom height
-            xaxis_title='Score',
-            yaxis_title='',
-            title='Model predictions and scores',
-            margin=dict(l=100, r=200, t=50, b=50),
-            uniformtext_minsize=8, 
-            uniformtext_mode='hide',
-        )
-        st.plotly_chart(fig=fig)
-    else:
-        st.write("Please enter some text to classify.")
+
+# Create a two-column layout
+col1, col2 = st.columns([2, 3])  # Adjust the width ratio as needed
+
+with col1:
+    # Checkbox to remove punctuation
+    remove_punct = st.checkbox(label="Remove punctuation", value=True)
+
+    # Text area for user input
+    input_str = st.text_area("Input text", height=275)
+
+    # Remove punctuation if checkbox is selected
+    if remove_punct and input_str:
+        # Specify the characters to remove
+        characters_to_remove = "○□()〔〕:\"。·, ?ㆍ" + punctuation
+        translating = str.maketrans('', '', characters_to_remove)
+        input_str = input_str.translate(translating)
+
+    # Display the input text after processing
+    st.write("Processed input:", input_str)
+
+    # Button for prediction
+    classify_button = st.button("Classify")
+
+# Predict and display the classification scores if input is provided and button is clicked
+if classify_button and input_str:
+    predictions = model_pipeline(input_str)
+    data = pd.DataFrame(predictions)
+    data = data.sort_values(by='score', ascending=True)
+    data.label = data.label.astype(str)
+    
+    # Displaying predictions as a bar chart
+    fig = go.Figure(
+        go.Bar(
+            x=data.score.values,
+            y=[f'{i}th Century' for i in data.label.values],
+            orientation='h', 
+            text=[f'{score:.3f}' for score in data['score'].values],
+            textposition='outside',
+            hoverinfo='text',
+            hovertext=[f'{i}th Century<br>Score: {score:.3f}' for i, score in zip(data['label'], data['score'])],
+            marker=dict(color=[colors[i % len(colors)] for i in range(len(data))]),
+        ))
+    fig.update_traces(width=0.4)
+    fig.update_layout(
+        height=300,  # Custom height
+        xaxis_title='Score',
+        yaxis_title='',
+        title='Model predictions and scores',
+        margin=dict(l=100, r=200, t=50, b=50),
+        uniformtext_minsize=8, 
+        uniformtext_mode='hide',
+    )
+    
+    with col2:
+        st.plotly_chart(fig, use_container_width=True)
+else:
+    with col2:
+        st.write("Please enter some text to classify and click 'Classify'.")