Plotly graphs print two times

Question

I'm trying to create an interactive graph with plotly but it keeps printing me two graphs instead of one.

Here's the code I'm using and the result I've got:

# Initialize the position of the bar with the first start value
start_value_bot = plateaus_bot[0][0]  # First start value in plateaus_bot
start_value_top = plateaus_top[0][0]  # First start value in plateaus_top

# Calculate the limits for the x and y axes based on the values of X_top and X_bot
x_min = min(fit['tAtm'])
x_max = max(fit['tAtm'])
y_min = min(fit['X_bot'].min(), fit['X_top'].min())  # The minimum value between X_bot and X_top
y_max = max(fit['X_bot'].max(), fit['X_top'].max()) + 100  # The maximum value between X_bot and X_top

# Create the initial figure with FigureWidget
fig = go.FigureWidget()

# Add the X_top and X_bot curves
fig.add_trace(go.Scatter(x=fit['tAtm'], y=fit['X_top'], mode='lines', name='X top'))
fig.add_trace(go.Scatter(x=fit['tAtm'], y=fit['X_bot'], mode='lines', name='X bot'))

# Add the first vertical line initially
line1 = go.layout.Shape(
    type="line",
    x0=fit['tAtm'][start_value_bot], x1=fit['tAtm'][start_value_bot],  # Initial position at the first start value
    y0=y_min, y1=y_max,  # y-range from y_min to y_max
    line=dict(color="red", width=1)
)

# Add the second vertical line initially
line2 = go.layout.Shape(
    type="line",
    x0=fit['tAtm'][start_value_top], x1=fit['tAtm'][start_value_top],
    y0=y_min, y1=y_max,  # y-range from y_min to y_max
    line=dict(color="blue", width=1)
)

# Add the vertical lines to the figure
fig.update_layout(shapes=[line1, line2])

# Add title and axes
fig.update_layout(
    title="Select stop point for tensio top and bottom",
    xaxis=dict(range=[x_min, x_max]),  # Dynamic x-axis range
    yaxis=dict(range=[y_min, y_max]),  # Dynamic y-axis range
    showlegend=True
)

# Function to update the position of the two vertical bars
def update_line_positions(x_position1, x_position2):
    # Clear the old data to only show one graph
    fig.data = []
    # Add the X_top and X_bot curves to the figure
    fig.add_trace(go.Scatter(x=fit['tAtm'], y=fit['X_top'], mode='lines', name='X top'))
    fig.add_trace(go.Scatter(x=fit['tAtm'], y=fit['X_bot'], mode='lines', name='X bot'))
    # Update the figure with the new bar positions
    fig.update_layout(
        shapes=[
            go.layout.Shape(
                type="line",
                x0=x_position1, x1=x_position1,  # Position of the first bar modified
                y0=y_min, y1=y_max,  # y-range from y_min to y_max
                line=dict(color="blue", width=1)
            ),
            go.layout.Shape(
                type="line",
                x0=x_position2, x1=x_position2,  # Position of the second bar modified
                y0=y_min, y1=y_max,  # y-range from y_min to y_max
                line=dict(color="red", width=1)
            )
        ]
    )
    # Show the updated figure again
    fig.show()

# Create a slider to move the first bar between 1 and 7 on the x-axis
slider_x1 = widgets.FloatSlider(value=fit['tAtm'][start_value_top], min=x_min, max=x_max, step=0.01, description='Stop top tension')

# Create a second slider to move the second bar between 1 and 7 on the x-axis
slider_x2 = widgets.FloatSlider(value=fit['tAtm'][start_value_bot], min=x_min, max=x_max, step=0.01, description='Stop bottom tension',)

# Use interact to link the two sliders to the function that updates the bars' positions
interact(update_line_positions, x_position1=slider_x1, x_position2=slider_x2)

enter image description here

I know it has something to do with the place of the fig.show() function but did not figured where to place it right.

Thanks in advance for your help