时间图

使用时间 x 轴创建可视化是一种常见的用例。让我们深入了解一下！

使用 pd.Dataframe 创建绘图

时间图需要在 x 轴上有一个日期时间列。这是一个使用一些航班数据的简单示例

import gradio as gr
import pandas as pd
import numpy as np
import random

from datetime import datetime, timedelta
now = datetime.now()

df = pd.DataFrame({
    'time': [now - timedelta(minutes=5*i) for i in range(25)],
    'price': np.random.randint(100, 1000, 25),
    'origin': [random.choice(["DFW", "DAL", "HOU"]) for _ in range(25)],
    'destination': [random.choice(["JFK", "LGA", "EWR"]) for _ in range(25)],
})

with gr.Blocks() as demo:
    gr.LinePlot(df, x="time", y="price")
    gr.ScatterPlot(df, x="time", y="price", color="origin")

demo.launch()

按时间聚合

你可能希望按时间段对数据进行分箱。使用 x_bin 来执行此操作，使用带有 "s"、"m"、"h" 或 "d" 的字符串后缀，例如 "15m" 或 "1d"。

import gradio as gr
from data import df

with gr.Blocks() as demo:
    plot = gr.BarPlot(df, x="time", y="price", x_bin="10m")

    bins = gr.Radio(["10m", "30m", "1h"], label="Bin Size")
    bins.change(lambda bins: gr.BarPlot(x_bin=bins), bins, plot)

demo.launch()

日期时间组件

你可以使用 gr.DateTime 接受日期时间数据输入。这非常适合用于定义数据 x 轴范围的绘图。

import gradio as gr
from data import df

with gr.Blocks() as demo:
    with gr.Row():
        start = gr.DateTime("now - 24h")
        end = gr.DateTime("now")
        apply_btn = gr.Button("Apply")
    plot = gr.LinePlot(df, x="time", y="price")

    apply_btn.click(lambda start, end: gr.BarPlot(x_lim=[start, end]), [start, end], plot)
    
demo.launch()

请注意 gr.DateTime 如何接受完整的日期时间字符串，或使用 now - [0-9]+[smhd] 格式的简写来引用过去的时间。

你通常会有许多时间图，在这种情况下，你希望保持 x 轴同步。DateTimeRange 自定义组件保持一组日期时间图同步，并且还使用绘图的 .select 监听器，允许你在保持绘图同步的同时缩放绘图。

因为它是一个自定义组件，你首先需要 pip install gradio_datetimerange。然后运行以下代码

import gradio as gr
from gradio_datetimerange import DateTimeRange
from data import df

with gr.Blocks() as demo:
    daterange = DateTimeRange(["now - 24h", "now"])
    plot1 = gr.LinePlot(df, x="time", y="price")
    plot2 = gr.LinePlot(df, x="time", y="price", color="origin")
    daterange.bind([plot1, plot2])

demo.launch()

尝试在绘图中缩放并查看 DateTimeRange 如何更新。所有绘图都会同步更新它们的 x_lim。组件中还有一个“返回”链接，允许你快速放大和缩小。

实时数据

在许多情况下，你正在处理实时的、实时的数据，而不是静态的 dataframe。在这种情况下，你可以使用 gr.Timer() 定期更新绘图。假设有一个 get_data 方法可以获取最新的 dataframe

with gr.Blocks() as demo:
    timer = gr.Timer(5)
    plot1 = gr.BarPlot(x="time", y="price")
    plot2 = gr.BarPlot(x="time", y="price", color="origin")

    timer.tick(lambda: [get_data(), get_data()], outputs=[plot1, plot2])

你还可以使用 every 简写将 Timer 附加到具有函数值的组件

with gr.Blocks() as demo:
    timer = gr.Timer(5)
    plot1 = gr.BarPlot(get_data, x="time", y="price", every=timer)
    plot2 = gr.BarPlot(get_data, x="time", y="price", color="origin", every=timer)