首页 > 解决方案 > 使用面板时 Altair 绘图未显示

问题描述

我正在关注使用 Panel 和 Altair 的本教程[ github ]。

返回我的情节的函数如下:

@pn.depends(ticker.param.value, date_range_slider.param.value)
def get_plot(ticker, date_range):

    df = data.stocks()
    df['date'] = pd.to_datetime(df['date'])

    start_date, end_date = date_range

    mask = (df['date'] > start_date) & (df['date'] <= end_date)
    dfm = df.loc[mask]

    chart = (alt.Chart(dfm)
        .mark_line()
        .encode(
            x='date', y='price',
            tooltip=alt.Tooltip(['date', 'price']))
        .transform_filter((datum.symbol == ticker))
    )
    return chart

我遇到了一个问题,如果直接执行,图表会正常显示:

在此处输入图像描述

但不是在使用 Panel 运行时:

在此处输入图像描述

似乎当我将工作chart放入 apanel时,它会丢失与数据的链接:

在此处输入图像描述

服务仪表板也有同样的问题,所以在我看来,Panel 和 Altair 之间存在兼容性问题。

有谁知道出了什么问题以及如何解决?

版本:

标签: pythonjupyter-labaltairpyviz

解决方案


这现在可以工作了,运行教程中的代码并在此问题中进行修改会显示绘图并响应小部件输入:

在此处输入图像描述

完整代码:

import panel as pn
import altair as alt
import pandas as pd
from vega_datasets import data
import datetime as dt
from altair import datum

alt.renderers.enable('default')
pn.extension('vega')

source = data.stocks()
source = pd.DataFrame(source)
source.head()

# set a title for your dashboard
title = '## Stock Price Dashboard'

subtitle = 'This dashboard allows you to select a company and date range to see stock prices.'

# create list of company names (tickers)
tickers = ['AAPL', 'GOOG', 'IBM', 'MSFT']

# this creates the dropdown widget
ticker = pn.widgets.Select(name='Company', options=tickers)

# this creates the date range slider
date_range_slider = pn.widgets.DateRangeSlider(
    name='Date Range Slider',
    start=dt.datetime(2001, 1, 1), end=dt.datetime(2010, 1, 1),
    value=(dt.datetime(2001, 1, 1), dt.datetime(2010, 1, 1))
)

@pn.depends(ticker.param.value, date_range_slider.param.value)
def get_plot(ticker, date_range):

    df = data.stocks()
    df['date'] = pd.to_datetime(df['date'])

    start_date, end_date = date_range

    mask = (df['date'] > start_date) & (df['date'] <= end_date)
    dfm = df.loc[mask]

    chart = (alt.Chart(dfm)
        .mark_line()
        .encode(
            x='date', y='price',
            tooltip=alt.Tooltip(['date', 'price']))
        .transform_filter((datum.symbol == ticker))
    )
    return chart

dashboard = pn.Row(
    pn.Column(title, subtitle, ticker, date_range_slider),
    get_plot # draw chart function!
)

dashboard

版本:

import session_info
session_info.show()
-----
altair              4.1.0
pandas              1.2.0
panel               0.10.3
vega_datasets       0.9.0
-----
IPython             7.19.0
jupyter_client      6.1.11
jupyter_core        4.7.0

推荐阅读