如何使条形图在条形图动画中可见？

Question

我正在尝试制作一个条形图动画来缓慢显示每个条形，但我无法使其按预期工作。当我运行代码时，该条形图显示得非常细，然后消失以显示下一个非常细的条形图。我希望这些条可见并保持不变，以便当动画结束时，所有条都在那里。以下是我的代码的一部分：

import pandas as pd
import numpy as np
import datetime
import plotly.graph_objects as go
import plotly.express as px
import plotly.io as pio
import streamlit as st
pio.renderers.default = 'notebook'

with tab1:
    st.title('Vendas diárias para o Mês Atual')
    fig1 = px.bar(df_agrupado, x='dt_emissao', y='lct_preco_item', text='lct_preco_item', 
                  animation_frame='dt_emissao', range_y=[0, 50000])
    fig1.update_traces(texttemplate='%{text:.2s}', textposition='outside')
    fig1.update_layout(
        xaxis=dict(
            tickmode='array',
            tickvals=df_agrupado['dt_emissao'],
            ticktext=[date.strftime('%d') for date in df_agrupado['dt_emissao']],
            range=[df_agrupado['dt_emissao'].min(), df_agrupado['dt_emissao'].max()]  # Set x-axis range
        ),
        bargap=0.2,  # Adjust the gap between bars
        bargroupgap=0.1,  # Adjust the gap between groups of bars
        xaxis_title='',  # Remove x-axis label
        yaxis_title=''   # Remove y-axis label
    )
    fig1.add_shape(
        type='line',
        x0=df_agrupado['dt_emissao'].min(),
        y0=media_vendas,
        x1=df_agrupado['dt_emissao'].max(),
        y1=media_vendas,
        line=dict(color='Red', dash='dash'),
    )
    fig1.add_shape(
        type='line',
        x0=df_agrupado['dt_emissao'].min(),
        y0=meta_diaria,
        x1=df_agrupado['dt_emissao'].max(),
        y1=meta_diaria,
        line=dict(color='Green', dash='dash'),
    )
    fig1.add_annotation(
        x=df_agrupado['dt_emissao'].max(),
        y=media_vendas,
        text=f'Média: {int(media_vendas/1000)}k',
        showarrow=False,
        yshift=10
    )
    fig1.add_annotation(
        x=df_agrupado['dt_emissao'].max(),
        y=meta_diaria,
        text=f'Meta Diária: {int(meta_diaria/1000)}k',
        showarrow=False,
        yshift=10
    )
    st.plotly_chart(fig1, key='fig1')

我正在一个 Streamlit 应用程序中执行此操作。任何帮助将不胜感激！

Answer 1

您可能面临的问题是您的动画更新条形高度的速度太快，导致其在跳转到下一个值之前以非常小的尺寸短暂闪烁。要解决此问题，您需要在每个动画步骤中随着时间的推移逐渐增加条形高度，而不是立即将其更改为完整值。