2016-09-27 10 views
8

をラインアップしていない私はPythonと可視化ライブラリBokehを使用してjupyterノートブックでテーブルを表示しようとしています。Pythonのボケ表の列とヘッダは

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のノートに私のテーブルを表示するには、次のコードを使用します。これは私のジュピターノートのバージョンが更新された後に発生しました。かかわらず、私は私の列ヘッダが並ぶとテーブルとの奇妙なオーバーラップを持たない幅を設定するものの:

enter image description here

これは、私はすべてが並ぶ素敵なテーブルを取得することができた、前に実現しなかったがアップ。ヘッダーを調整しても、まだ整列していません。私が代わりにショーを(呼び出しのhtmlファイルとしてテーブルを保存するとき、これはJupyterノートブックに直接)は発生しません。私は何を変更する必要がありますか?これを行うより良い方法はありますか?

フル例

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')) 

これは次のバージョンを使用してシステム上で実行されている:

  • Jupyter 4.2.0
  • パイソン2.7.12(アナコンダ2.3.0 64ビット)
  • ボケ0.12.2

答えて

2

Jupyterノートブック用のボケウィジェットのCSSスタイルは.bk-root .bk-slick-header-column.bk-ui-state-defaultがハードコードされheight:16px要素についてhttp://cdn.pydata.org/bokeh/release/bokeh-widgets-0.12.0.min.css、です。したがって、CSSを変更しなければ変更することはできません。

それは永続的な変更のCSSのHTML機能

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

でadhockをスタイリングすることができますがJupyterの設定でcustomディレクトリに追加することができます。それはデフォルトでは

jupyter --config-dir 

を呼び出すことである場合、あなたはそれがその後、 ~/.jupyter/custom/custom.cssであることを ~/.jupyter 新しいCSS必要で把握することができます。幅については並んでいないものを enter image description here

+0

enter image description here

?ヘッダと行の幅はCSSの条件に異なるように設定されているため – klib

+2

修正することはより困難です。第一子{ 幅: '.bkルート.bkスリック - ヘッダ-column.bk-UI-状態のデフォルトを使用することが可能です!40ピクセル重要。最初の列が整列される ' だけ} – jackdaw

関連する問題