[Dúvida] Atualizar gráfico em uma tela no flet | Python web

Boa noite! Estou desenvolvendo uma tela no python usando flet. Porém só consigo plotar um grafico uma vez, quando altero os dados o gráfico não é atualizado na tela.

Aqui está o código:

import flet as ft
import CalcularParametros
import matplotlib
import matplotlib.pyplot as plt
from flet.matplotlib_chart import MatplotlibChart


matplotlib.use("svg")

def main(page: ft.Page):
    page.title = "Transient Response Parameters"
    #page.vertical_alignment = ft.MainAxisAlignment.CENTER
    page.window_width = 550
    page.window_height = 820
    page.window_maximizable = False
    page.window_resizable = False


    def pick_files_result(e: ft.FilePickerResultEvent):
        selected_files.value = (
           ", ".join(map(lambda f: f.path, e.files)) if e.files else "Nenhum arquivo selecionado!"
        )
        
        nome_arquivo.value = (
           ", ".join(map(lambda f: f.name, e.files)) if e.files else "Nenhum arquivo selecionado!"
        )
        
        page.update()

    pick_files_dialog = ft.FilePicker(on_result=pick_files_result)
    selected_files = ft.Text()
    nome_arquivo = ft.Text()
    
    page.overlay.append(pick_files_dialog)
    
    # Incluindo botão pesquisar
    botao_pesquisar = ft.ElevatedButton("Escolher Arquivo",icon=ft.icons.UPLOAD_FILE,on_click=lambda _: pick_files_dialog.pick_files(
                        allow_multiple=False,
                        allowed_extensions=["txt"]
                        ),
                        )
    
    def button_clicked(e):
        #tempo_amostragem.value = f"Tempo de amostragem: {label1.value}"
        #degrau.value = f"Degrau: {label2.value}"
        try:
            resposta_planta.value = CalcularParametros.calcular_parametros(label1.value, label2.value, selected_files.value)
        except:
            pass
            
        try:     
            arrays = CalcularParametros.obter_array(label1.value, selected_files.value)
            
            tempo = arrays[0]
            saida = arrays[1]
            
            fig, ax = plt.subplots()
            
            ax.plot(tempo, saida, linestyle='-', color='b')

            ax.set_ylabel("Saída")
            ax.set_xlabel("Tempo de Amostragem")
            ax.set_title("Resultados")
            ax.grid()
            
            grafico = ft.ResponsiveRow([MatplotlibChart(fig, expand=False, isolated=True, original_size=10)],alignment=ft.MainAxisAlignment.START)
            
            page.add(grafico)
            
        except:
            pass
        
        page.update()
        
    resposta_planta = ft.Text()
    #tempo_amostragem = ft.Text()
    label1 = ft.TextField(label="Tempo de Amostragem (segundos)", border_color='white', width=250, height=60, max_length=8)
    
    
    #degrau = ft.Text()
    label2 = ft.TextField(label="Valor do Degrau", border_color='white', width=250, height=60, max_length=8)
    
    botao_start = ft.ElevatedButton(text="Iniciar",on_click=button_clicked)
    
    
    page.add(
        
        ft.ResponsiveRow([label1, label2]),
    
        ft.ResponsiveRow([botao_pesquisar, botao_start], alignment=ft.MainAxisAlignment.START),
         
        ft.ResponsiveRow([resposta_planta]),
    )


ft.app(target=main)

Olá, Silas! Parece que você está tendo um problema com a atualização do gráfico na sua aplicação flet.

O problema pode estar na forma como você está adicionando o gráfico à página. Quando você chama page.add(grafico), você está adicionando um novo gráfico à página, mas não está removendo o gráfico antigo. Isso pode fazer com que o gráfico antigo continue sendo exibido, mesmo após a atualização dos dados.

Uma possível solução seria remover o gráfico antigo antes de adicionar o novo. Para isso, você pode usar o método page.remove(grafico). No entanto, para usar este método, você precisa ter uma referência ao gráfico que deseja remover. Uma forma de fazer isso seria armazenar o gráfico em uma variável de escopo mais amplo.

Aqui está um exemplo de como você poderia fazer isso:

grafico = None

def button_clicked(e):
    global grafico
    # ...
    try:     
        # ...
        if grafico is not None:
            page.remove(grafico)

        grafico = ft.ResponsiveRow([MatplotlibChart(fig, expand=False, isolated=True, original_size=10)],alignment=ft.MainAxisAlignment.START)
        page.add(grafico)
    except:
        pass
    page.update()

Neste exemplo, a variável grafico é definida fora da função button_clicked, então ela pode ser acessada dentro da função. Antes de adicionar um novo gráfico, o código verifica se já existe um gráfico e, se existir, o remove da página.

Espero ter ajudado e bons estudos!