Python 散景 table 列和 headers 不对齐

Question

我正在尝试使用 python 和可视化库 Bokeh 在 jupyter notebook 中显示 table。我使用以下代码在 jupyter notebook 中显示我的 table，其中 result 是一个数据框：

source = ColumnDataSource(result)

columns = [
        TableColumn(field="ts", title="Timestamp"),
        TableColumn(field="bid_qty", title="Bid Quantity"),
        TableColumn(field="bid_prc", title="Bid Price"),
        TableColumn(field="ask_prc", title="Ask Price"),
        TableColumn(field="ask_qty", title="Ask Quantity"),
    ]

data_table = DataTable(source=source, columns=columns, fit_columns=True, width=1300, height=800)
show(widgetbox([data_table], sizing_mode = 'scale_both'))

以前我使用的是 vform，尽管它现在似乎已经贬值并且不再按预期工作。这发生在我的 jupyter notebook 版本更新之后。无论我设置什么宽度，我的列 headers 都不会对齐并且与 table:

有奇怪的重叠

这在以前没有发生过，我能够得到一个很好的 table 一切都排成一行。即使我调整 headers 他们仍然不排队。当我将 table 保存为 html 文件而不是直接在 Jupyter notebook 中调用 show() 时，不会发生这种情况。我需要改变什么？有更好的方法吗？

完整示例

from bokeh.io import show, output_notebook
from bokeh.layouts import widgetbox
from bokeh.models import ColumnDataSource
from bokeh.models.widgets import TableColumn, DataTable
import pandas as pd

output_notebook()

d = {'one' : pd.Series([1., 2., 3.], index=['a', 'b', 'c']), 
 'two' : pd.Series([1., 2., 3., 4.], index=['a', 'b', 'c', 'd'])}
df = pd.DataFrame(d)

source = ColumnDataSource(df)

columns = [
    TableColumn(field="one", title="One"),
    TableColumn(field="two", title=" Two"),
]

data_table = DataTable(source=source, columns=columns, 
    fit_columns=True, width=800, height=800)
show(widgetbox([data_table], sizing_mode = 'scale_both'))

这是运行在具有以下版本的系统上：

木星 4.2.0
Python 2.7.12（蟒蛇 2.3.0 64 位）
散景 0.12.2

Answer 1

Jupyter 笔记本的 Bokeh 小部件的 css 样式在 http://cdn.bokeh.org/bokeh/release/bokeh-widgets-0.12.0.min.css 中，其中元素 .bk-root .bk-slick-header-column.bk-ui-state-default 的 height:16px 是硬编码的。所以不改变css就不能改变它。

它可以通过 HTML 函数

设置样式

from IPython.core.display import HTML
HTML("""
<style>
.bk-root .bk-slick-header-column.bk-ui-state-default {
height: 25px!important;
}
</style>
""")

对于持久性更改 css 可以添加到 Jupyter 配置中的 custom 目录。您可以通过调用

找出它的位置

jupyter --config-dir

默认为~/.jupyter 新的 css 需要在 ~/.jupyter/custom/custom.css 然后。

之前

之后

Python 散景 table 列和 headers 不对齐

Python Bokeh table columns and headers don't line up

python

ipython

bokeh

jupyter