0

我按照 Panel docs 中的这个示例在 jupyter notebook 中尝试了一些自定义 css 样式。

面板样式和 hvplot 之间似乎存在一些奇怪的干扰:

首先导入 hvplot.pandas 似乎总是让面板忽略以后使用 css 样式信息调用 pn.extenstion() 。(在文档中有一个警告。到目前为止一切都很好。)

当我首先调用 pn.extension(...) 时,它仅适用于指定为“raw_css”的 css。如果将 css 指定为“css_files”,则后续导入 hvplot.pandas 会使面板忘记 css 样式。

我无法让面板使用 css 文件中的 css 信息并同时使用 hvplot.pandas。我错过了什么吗?

(当然,这可能是实际应用程序的一个极端案例,但它很容易发生在你使用许多库的笔记本中。我花了一段时间才发现涉及到 hvplot。这就是为什么我'我在这里详细描述它。)

以下是一些代码示例:

按预期工作

在以下示例中,滑块按预期显示为黄色背景:

import panel as pn
pn.extension(raw_css=['.bk.panel-widget-box {background: #f0f000;}'])
pn.Column(pn.widgets.FloatSlider(name='Number'), css_classes=['panel-widget-box'])
import panel as pn
pn.extension(css_files=['test.css'])
pn.Column(pn.widgets.FloatSlider(name='Number'), css_classes=['panel-widget-box'])
import panel as pn
pn.extension(raw_css=['.bk.panel-widget-box {background: #f0f000;}'])
import hvplot.pandas
pn.Column(pn.widgets.FloatSlider(name='Number'), css_classes=['panel-widget-box'])

(test.css的内容.bk.panel-widget-box {background: #f0f000;}:)

不工作

在以下示例中,没有黄色背景:

import panel as pn
import hvplot.pandas
pn.extension(raw_css=['.bk.panel-widget-box {background: #f0f000;}'])
pn.Column(pn.widgets.FloatSlider(name='Number'), css_classes=['panel-widget-box'])
import panel as pn
import hvplot.pandas
pn.extension(css_files=['test.css'])
pn.Column(pn.widgets.FloatSlider(name='Number'), css_classes=['panel-widget-box'])
import panel as pn
pn.extension(css_files=['test.css'])
import hvplot.pandas
pn.Column(pn.widgets.FloatSlider(name='Number'), css_classes=['panel-widget-box'])
4

0 回答 0