印刷ツールの構成

Bokehには、情報を報告したり、ズームレベルや範囲範囲のような描画パラメータを変更したり、フォントを追加、編集、または削除したりするために、多くの対話型ツールが付属しています。ツールは4つの基本カテゴリに分類される:

手つき.

これらのツールは、平行移動のような単一のジェスチャに応答することができる。ジェスチャーツールのタイプは:

各タイプのジェスチャについては、任意の所与の時間に1つのツールがアクティブ状態にあることができ、ツールアイコンの横のハイライト表示は、ツールバー上にアクティビティのツールを指示することができる。

行くぞ!

これらは即時操作またはモード操作であり、ツールバーのボタンが押下されたときにのみ起動され、例えば ResetTool それがそうです。

検査員.

これらは何らかの方法で情報を報告したり、描画を書き込みたりする受動的なツールである。 HoverTool あるいは…。 CrosshairTool それがそうです。

編集ツール

これらは複雑なマルチジェスチャツールであり,描画上のフォントを追加,削除,修正することができる.編集ツールは複数のジェスチャに同時に応答する可能性があるため,編集ツールが起動されると,複数の単一ジェスチャツールを即座に停止する可能性がある.

本章では,すべての個々のツールに関する情報に加えて,ツールバーをどのように配置するかについて述べる.

位置決めツールバー

デフォルトの場合,Bokeh描画は描画上にツールバーを持つ.本節では、ツールバーの異なる位置をどのように指定するか、またはどのように完全に削除するかを知ることになります。

ツールバーの位置は伝達することで toolbar_location パラメータは figure() 機能します。有効値は、以下のことを含む。

  • "above"

  • "below"

  • "left"

  • "right"

ツールバーを完全に隠す場合は、お渡しください None それがそうです。

以下にツールバーを描画の下に置くいくつかのコードを示す.コードを実行して変更しようとしています toolbar_location 値。

from bokeh.plotting import figure, output_file, show

output_file("toolbar.html")

# create a new plot with the toolbar below
p = figure(plot_width=400, plot_height=400,
           title=None, toolbar_location="below")

p.circle([1, 2, 3, 4, 5], [2, 5, 8, 2, 7], size=10)

show(p)

なお、ツールバー位置は、黙認軸と衝突しており、本例では、 toolbar_sticky 選択権. False ツールバーを描画軸の領域から移動させる.

from bokeh.plotting import figure, output_file, show

output_file("toolbar.html")

# create a new plot with the toolbar below
p = figure(plot_width=400, plot_height=400,
           title=None, toolbar_location="below",
           toolbar_sticky=False)

p.circle([1, 2, 3, 4, 5], [2, 5, 8, 2, 7], size=10)

show(p)

指定道具

底値 bokeh.models レベルはツールを追加します Plot 伝達することで Tool オブジェクトを追加する add_tools 方法:

plot = Plot()
plot.add_tools(LassoSelectTool())
plot.add_tools(WheelZoomTool())

このような追加ツールの明示的な方法は任意のBokehに適用される. Plot あるいは…。 Plot サブクラス、例えば Figure それがそうです。

ツールは tools パラメータは figure() 機能します。Toolsパラメータは、ツールオブジェクトリスト、例えば:

tools = [BoxZoomTool(), ResetTool()]

また、ツールのショートカット名を含むコンマ分割文字列をツールに容易に提供することができる:

tools = "pan,wheel_zoom,box_zoom,reset"

しかし,この方法ではツールの属性を設定することは許されない.

最後に,ツールオブジェクトをツールオブジェクトに渡すことで add_tools 筋の仕方。これもまた tools 上記のキーワード:

from bokeh.models import BoxSelectTool

plot = figure(tools="pan,wheel_zoom,box_zoom,reset")
plot.add_tools(BoxSelectTool(dimensions="width"))

活動ツールを設置する

Bokehツールバーは,各ジェスチャ(ドラッグ,スクロール,クリック)からの1つのアクティブツールを(最大)持つことができる.デフォルトの場合、Bokehは、アクティブ状態になるように、構成されたツールセットから各ツールのうちの1つを選択するために、デフォルトの所定の優先順位を使用する。

However, it is possible to exert control over which tool is active. At the lowest bokeh.models level, this is accomplished by using the active_drag, active_inspect, active_scroll, and active_tap properties of Toolbar. These properties can take the following values:

  • None -このような既存の道具はありません

  • "auto" -Bokehは、このようなツールをアクティブ状態に選択する(ない可能性がある)

  • A Tool インスタンス-Bokehは、所与のツールをアクティブツールに設定します。

また、 active_inspect ツールは受け入れられます:*一連の Tool アクティブツールとして設定する例

例:

# configure so that no drag tools are active
plot.toolbar.active_drag = None

# configure so that Bokeh chooses what (if any) scroll tool is active
plot.toolbar.active_scroll = "auto"

# configure so that a specific PolySelect tap tool is active
plot.toolbar.active_tap = poly_select

# configure so that a sequence of specific inspect tools are active
# note: this only works for inspect tools
plot.toolbar.active_inspect = [hover_tool, crosshair_tool]

これらすべての属性のデフォルト値は "auto" それがそうです。

これらの属性をキーワードパラメータとして渡すことで figure() 機能します。構成を容易にするために、任意の文字列名を渡すこともできる:

# configures the lasso tool to be active
plot = figure(tools="pan,lasso_select,box_select", active_drag="lasso_select")

平行移動/ドラッグツール

これらのツールは、平行移動(タッチデバイス上)または左キードラッグ(マウスデバイス上)によって使用される。一度に1つの並進/ドラッグツールしかアクティブ状態にありません。適用される場合、平行移動/ドラッグツールは、範囲に設定された任意の最大値および最小値に従う。

BoxSelectTool

  • 名前: 'box_select'

  • アイコン: box_select_icon

ボックス選択ツールは、ユーザが左キーでマウスをドラッグするか、描画領域上で指をドラッグすることにより、矩形選択領域を定義することができる。ボックス選択ツールは、設定によって構成することができる dimensions 属性が width あるいは…。 height デフォルト設定ではありません both それがそうです。

選択を行うと,上の属性から選択点のインデックスを得ることができる Selection フォントデータソース用です。例:

source.selected.indices

選択されたインデックスは、“散布”タイプの字形によく見られる場合に保存されます。

注釈

複数の選択を行うためには、Shiftボタンを押してください。選択をクリアするためには、Escボタンを押してください。

BoxZoomTool

  • 名前: 'box_zoom'

  • アイコン: box_zoom_icon

枠縮小ツールは、ユーザが描画境界を格納する矩形領域を定義することを可能にする。これは,左ボタンでマウスをドラッグしたり,描画領域で指をドラッグしたりすることで行うことができる.

LassoSelectTool

  • 名前: 'lasso_select'

  • アイコン: lasso_select_icon

ソケット選択ツールは、ユーザが左キーでマウスをドラッグするか、または描画領域上で指をドラッグすることによって、選択のための任意の領域を定義することができる。

選択を行うと,上の属性から選択点のインデックスを得ることができる Selection フォントデータソース用です。例:

source.selected.indices

選択されたインデックスは、“散布”タイプの字形によく見られる場合に保存されます。

注釈

複数の選択を行うためには、Shiftボタンを押してください。選択をクリアするためには、Escボタンを押してください。

PanTool

  • name: 'pan', 'xpan', 'ypan',

  • アイコン: pan_icon

平行移動ツールは、ユーザが左キーでマウスをドラッグするか、描画領域において指をドラッグすることによって描画を平行移動させることができる。

平行移動ツールは、x軸のみに作用するか、またはy軸のみに作用するように制約されてもよく、方法は、 dimensions 属性は以下を含むリストに追加される width あるいは…。 height それがそうです。また道具の別名もあります 'xpan' そして 'ypan' それぞれです。

ツールをクリック/クリックする

これらのツールは、タッチ(タッチデバイス上)または左クリック(マウスデバイス上)によって使用することができる。一度に1つのクリック/クリックツールしか起動できません。

PolySelectTool

  • 名前: 'poly_select'

  • アイコン: poly_select_icon

ポリゴン選択ツールは、ユーザがマウスの左クリックまたは異なる位置で指をタップすることによって、選択のための任意のポリゴン領域を定義することを可能にする。

選択を行うと,上の属性から選択点のインデックスを得ることができる Selection フォントデータソース用です。例:

source.selected.indices

選択されたインデックスは、“散布”タイプの字形によく見られる場合に保存されます。

注釈

左キーまたはタップをダブルクリックすることで選択が完了します。複数の選択を行うためには、Shiftボタンを押してください。選択をクリアするためには、Escボタンを押してください。

TapTool

  • 名前: 'tap'

  • アイコン: tap_icon

選択ツールをクリックすることで,ユーザはマウス左ボタンをクリックしたり,指でクリックしたりすることで一点を選択することができる.

選択を行うと,上の属性から選択点のインデックスを得ることができる Selection フォントデータソース用です。例:

source.selected.indices

選択されたインデックスは、“散布”タイプの字形によく見られる場合に保存されます。

注釈

複数の選択を行うためには、Shiftボタンを押してください。選択をクリアするためには、Escボタンを押してください。

転動·収縮工具

これらのツールは、(タッチデバイス上で)つまんだり、スクロールしたり(マウスデバイス上で)使用することによって使用される。一度に1つのスクロール/収縮工具しか可動状態にない。

WheelZoomTool

  • name: 'wheel_zoom', 'xwheel_zoom', 'ywheel_zoom'

  • アイコン: wheel_zoom_icon

ローラズームツールは,現在のマウス位置を中心に拡大して描画する.これは、任意の最小値および最大値および範囲を尊重し、これらの値を超える範囲を拡大および縮小することを防止する。

ローラスケーリングツールは、x軸のみに作用するか、またはy軸のみに作用するように制約することもでき、方法は、 dimensions 属性は以下を含むリストに追加される width あるいは…。 height それがそうです。また道具の別名もあります 'xwheel_zoom' そして 'ywheel_zoom' それぞれです。

WheelPanTool

  • name: 'xwheel_pan', 'ywheel_pan'

  • アイコン: wheel_pan_icon

ローラ並進ツールは、ウィンドウのアスペクト比を変更することなく、指定されたサイズに沿って描画ウィンドウを平行移動させる。このツールは、任意の最小値および最大値および範囲を尊重し、平行移動がこれらの値を超えることを防止する。

行くぞ!

操作は、ツールバーのボタンを軽くタッチまたはクリックした場合にのみ起動される操作である。彼らは一般的に感情的または即時的に行動する。

UndoTool

  • 名前: 'undo'

  • アイコン: undo_icon

破棄ツールは,描画の以前の状態を回復することを可能にする.

RedoTool

  • 名前: 'redo'

  • アイコン: redo_icon

やり直しツールは,ツールが実行した前回の操作を破棄することができる.

ResetTool

  • 名前: 'reset'

  • アイコン: reset_icon

リセットツールは,描画範囲をそのプリミティブに復元する.

SaveTool

  • 名前: 'save'

  • アイコン: save_icon

保存ツールは、ユーザが描画したPNG画像を保存することができるモードダイアログをポップアップする。

ZoomInTool

  • name: 'zoom_in', 'xzoom_in', 'yzoom_in'

  • アイコン: zoom_in_icon

拡大ツールは描画のスケーリングを増加させます。それはすべての最小と最大値と範囲を尊重し、このような値と範囲を拡大して縮小することを防止するだろう。

ローラスケーリングツールは、x軸のみに作用するか、またはy軸のみに作用するように制約することもでき、方法は、 dimensions 属性は以下を含むリストに追加される width あるいは…。 height それがそうです。また道具の別名もあります 'xzoom_in' そして 'yzoom_in' それぞれです。

ZoomOutTool

  • name: 'zoom_out', 'xzoom_out', 'yzoom_out'

  • アイコン: zoom_out_icon

縮小ツールは、描画のスケーリングレベルを低下させます。これは、任意の最小値および最大値および範囲を尊重し、これらの値を超える範囲を拡大および縮小することを防止する。

ローラスケーリングツールは、x軸のみに作用するか、またはy軸のみに作用するように制約することもでき、方法は、 dimensions 属性は以下を含むリストに追加される width あるいは…。 height それがそうです。また道具の別名もあります 'xzoom_in' そして 'yzoom_in' それぞれです。

検査員.

チェッカは受動ツールであり,現在のカーソル位置に応じて描画に関する情報をアノテーションしたり報告したりする.任意の数の検査員は、任意の所与の時間にアクティブ状態にすることができる。ツールバーのチェッカメニューは、ユーザが任意のチェッカのアクティブ状態を切り替えることを可能にする。

CrosshairTool

  • 名前: 'crosshair'

  • メニューアイコン: crosshair_icon

Th crosshair tool draws a crosshair annotation over the plot, centered on the current mouse position. The crosshair tool draw dimensions may be configured by setting the dimensions property to one of the enumerated values width, height, or both.

HoverTool

  • 名前: 'hover'

  • メニューアイコン: hover_icon

ホバリングツールは受動検査器ツールである。これは、通常は常に開いた状態であるが、ツールバーに関連する検査員メニューで構成することができる。

基本ツール提示

デフォルトの場合、ホバリングツールは、各行が1つのラベルおよびその関連値を含む“テーブル”ツールプロンプトを生成する。ラベルと値はリストの形で提供される (ラベル、値) 元グループです。たとえば,次の左側のツール提示には付随的なものを用いる. tooltips 右辺の定義。

hover_basic

hover.tooltips = [
    ("index", "$index"),
    ("(x,y)", "($x, $y)"),
    ("radius", "@radius"),
    ("fill color", "$color[hex, swatch]:fill_color"),
    ("foo", "@foo"),
    ("bar", "@bar"),
]

先頭のフィールド名 $ “特殊分野”ですこれらの値は、通常、データまたはスクリーン空間におけるマウスの座標のような描画固有の値に対応する。以下にこれらの特別なフィールドを示す。

$index

データソースの選択ポイントのインデックス

$name

の値 name ホバリングした字形レンダラーの属性

$x

データ空間におけるカーソル下のX座標

$y

データ空間におけるカーソル下のY座標

$sx

スクリーン(キャンバス)空間におけるカーソル下のX座標

$sy

スクリーン(キャンバス)空間におけるカーソル下のY座標

$color

データソースの色、文法は: $color[options]:field_name それがそうです。利用可能なオプションは、 hex (色を16進数値として表示)、および swatch 小さな色板を表示することもできます

先頭のフィールド名 @ 中の列は関連している. ColumnDataSource それがそうです。例えば、フィールド名 "@price" 表示されるのは "price" 列、ホバリングをトリガすればいいです。ホバリングが17番目の字形である場合、ホバリングツール提示は、それに応じて17番目の価格値を表示する。

列名にスペースが含まれている場合は、例えば、大きな括弧で囲まなければならないことに注意されたい @{{adjusted close}} 名前の列中の値を表示する "adjusted close" それがそうです。

(特にスタックグラフに対して)列の名前を間接的に指定することを許す必要がある場合がある.フィールド名 @$name 異なる点は調べてみることです name フィールドは、その値を列名として使用する。例えば、ユーザが名前を使用してホバリングしている場合 "US East" そして、そして @$name 相等しい. @{{US East}} それがそうです。

以下は設定をどのようにするかを説明する完全な例である tooltips はいの論点です。 figure

from bokeh.plotting import ColumnDataSource, figure, output_file, show

output_file("toolbar.html")

source = ColumnDataSource(data=dict(
    x=[1, 2, 3, 4, 5],
    y=[2, 5, 8, 2, 7],
    desc=['A', 'b', 'C', 'd', 'E'],
))

TOOLTIPS = [
    ("index", "$index"),
    ("(x,y)", "($x, $y)"),
    ("desc", "@desc"),
]

p = figure(plot_width=400, plot_height=400, tooltips=TOOLTIPS,
           title="Mouse over the dots")

p.circle('x', 'y', size=20, source=source)

show(p)

ヒットテスト行為

ホバリングツールは,単一の字形に関連する情報ツール提示を表示する.これらのツール提示は、異なる方法で使用されるように構成することができる mode 財産:

"mouse"

マウスが字形のすぐ上にある場合にのみ

"vline"

マウス位置の垂直線が字形と交わるたびに

"hline"

マウス位置の水平線が字形と交わるたびに

デフォルト構成は mode = "mouse" それがそうです。これは 基本ツール提示 上の例です。次の例は ツール提示フィールドのフォーマットの設定 この例の設定例を示す. mode = "vline" それがそうです。

ツール提示フィールドのフォーマットの設定

デフォルトの場合、フィールドの値(例えば、 @foo )を基本デジタル形式で表示します。しかしながら、値のフォーマットをより正確に制御することができる。フィールドは、括弧内で指定されたフォーマットを末尾に追加することによって修正されてもよい。以下にいくつかの例を示す.

"@foo{0,0.000}"    # formats 10000.1234 as: 10,000.123

"@foo{(.00)}"      # formats -10000.1234 as: (10000.123)

"@foo{($ 0.00 a)}" # formats 1230974 as: $ 1.23 m

上記の例は、デフォルトフォーマット設定方式を使用しています。しかしながら、フォーマット文字列を解釈するために他のフォーマット方式を指定することもできる:

"numeral"

様々な数字、通貨、バイト、時間、および百分率フォーマットが提供される。フルフォーマットで NumeralTickFormatter 文書を参照する。

"datetime"

日付と時間値のフォーマットを提供する。完全なフォーマットは DatetimeTickFormatter 文書を参照する。

"printf"

Cスタイルと同様の“printf”タイプ説明子のフォーマットを提供します。ご参照ください PrintfTickFormatter 完全な詳細については、参照文書を参照されたい。

これらは構成によって formatters ホバリングツールの属性。この属性は,ツール提示変数をフォーマットスキームにマッピングする.例えば、使用するには "datetime" 列形式を設定する案 "@{{close date}}" で、設定値:

hover_tool.formatters = { "@{close date}": "datetime"}

“特別な変数”にForMattersを提供することもできます例えば "$x"

hover_tool.formatters = { "$x": "datetime"}

列名にフォーマットプログラムが指定されていなければ,デフォルトでは考えられる. "numeral" プログラムをフォーマットすると仮定する.

フォーマット仕様もスペース付き列名と互換性があることに注意してください。例えば @{{adjusted close}}{{($ 0.00 a)}} フォーマットは、“調整されたオフ”という列に適用されます。

以下の例示的なコードは明示的な構成を示している HoverTool 異なるフィールドを使用する異なるフォーマット化されたプログラム:

HoverTool(
    tooltips=[
        ( 'date',   '@date{%F}'            ),
        ( 'close',  '$@{adj close}{%0.2f}' ), # use @{ } for field names with spaces
        ( 'volume', '@volume{0.00 a}'      ),
    ],

    formatters={
        '@date'        : 'datetime', # use 'datetime' formatter for '@date' field
        '@{adj close}' : 'printf',   # use 'printf' formatter for '@{adj close}' field
                                     # use default 'numeral' formatter for other fields
    },

    # display a tooltip whenever the cursor is vertically in line with a glyph
    mode='vline'
)

次の描画上にマウスをドロップすることで、この構成で生成された出力が見られます。

使用 CustomJSHover モデルは,JavaScriptを用いてカスタムフォーマットプログラムを指定することも可能であり,このフォーマットプログラムはツール提示に派生数を表示することができる.

画像が止まっている.

ホバリングツールは、対応する画像フォントを含む可能性がある画像フォントを検査するために使用することができる ColumnDataSource

import numpy as np

from bokeh.plotting import figure, output_file, show

output_file("tools_hover_tooltip_image.html")

ramp = np.array([np.linspace(0, 10, 200)]*20)
steps = np.array([np.linspace(0, 10, 10)]*20)
bitmask = np.random.rand(25, 10) > 0.5

data = dict(image=[ramp, steps, bitmask],
            squared=[ramp**2, steps**2, bitmask**2],
            pattern=['smooth ramp', 'steps', 'bitmask'],
            x=[0, 0, 25],
            y=[5, 20, 5],
            dw=[20,  20, 10],
            dh=[10,  10, 25])

TOOLTIPS = [
    ('name', "$name"),
    ('index', "$index"),
    ('pattern', '@pattern'),
    ("x", "$x"),
    ("y", "$y"),
    ("value", "@image"),
    ('squared', '@squared')
]

p = figure(x_range=(0, 35), y_range=(0, 35), tools='hover,wheel_zoom', tooltips=TOOLTIPS)
p.image(source=data, image='image', x='x', y='y', dw='dw', dh='dh', palette="Inferno256", name="Image Glyph")

show(p)

In this example, three image patterns are defined, named ramp, steps, and bitmask. The hover tooltip shows the index of the image, the name of the pattern, the x and y position of the cursor, as well as the corresponding value and value squared.

カスタムツール提示

ツール提示にカスタマイズHTMLテンプレートを提供することも可能である.そのため,HTML文字列を渡し,置換が必要な場所でBokehツールを用いてフィールド名記号を提示してください.以上のすべてのフォーマット等に関する情報は依然として適用される.ご利用いただけますのでご注意ください {{safe}} 列名の後にフォーマットを設定して、データソース内のHTML変換を無効にします。以下は一例である。

from bokeh.plotting import ColumnDataSource, figure, output_file, show

output_file("toolbar.html")

source = ColumnDataSource(data=dict(
    x=[1, 2, 3, 4, 5],
    y=[2, 5, 8, 2, 7],
    desc=['A', 'b', 'C', 'd', 'E'],
    imgs=[
        'https://docs.bokeh.org/static/snake.jpg',
        'https://docs.bokeh.org/static/snake2.png',
        'https://docs.bokeh.org/static/snake3D.png',
        'https://docs.bokeh.org/static/snake4_TheRevenge.png',
        'https://docs.bokeh.org/static/snakebite.jpg'
    ],
    fonts=[
        '<i>italics</i>',
        '<pre>pre</pre>',
        '<b>bold</b>',
        '<small>small</small>',
        '<del>del</del>'
    ]
))

TOOLTIPS = """
    <div>
        <div>
            <img
                src="@imgs" height="42" alt="@imgs" width="42"
                style="float: left; margin: 0px 15px 15px 0px;"
                border="2"
            ></img>
        </div>
        <div>
            <span style="font-size: 17px; font-weight: bold;">@desc</span>
            <span style="font-size: 15px; color: #966;">[$index]</span>
        </div>
        <div>
            <span>@fonts{safe}</span>
        </div>
        <div>
            <span style="font-size: 15px;">Location</span>
            <span style="font-size: 10px; color: #696;">($x, $y)</span>
        </div>
    </div>
"""

p = figure(plot_width=400, plot_height=400, tooltips=TOOLTIPS,
           title="Mouse over the dots")

p.circle('x', 'y', size=20, source=source)

show(p)

編集ツール

編集ツールは、クライアントにフォントを描画、修正、削除する機能を提供します ColumnDataSource データです。

すべての編集ツールは少量のキーバインディングを共有します:

SHIFT

選挙区に追加するか、描画を開始する修正キー

BACKSPACE

選定した字形を削除する

ESC

選択した内容を一掃する

注釈

MacBookや他のいくつかのキーボードでは、チェックアウトキーは“削除”と表記されています。

BoxEditTool

  • 名前: 'box_edit'

  • メニューアイコン: box_edit_icon

BoxEditToolは描画、ドラッグ、削除を可能にする Rect 1つ以上のレンダラー上のフォント、方法が編集ベース ColumnDataSource データです。他の描画ツールと同様に、編集するレンダラは、リスト形式で明示的に提供されなければならない。

r1 = p.rect('x', 'y', 'width', 'height', source=source)
r2 = p.rect('x', 'y', 'width', 'height', source=source2)
tool = BoxEditTool(renderers=[r1, r2])

The tool will automatically modify the columns on the data source corresponding to the x, y, width, and height values of the glyph. Any additional columns in the data source will be padded with the declared empty_value, when adding a new box. When drawing a new box, the data will always be added to the ColumnDataSource on the first supplied renderer.

例えば、特定の数の関心領域が指定された場合、描画可能な要素の数を制限することも一般的に有用である。使用 num_objects 属性は,制限に達すると,最も古いボックスがキューからポップアップされ,追加する新しいボックスのための空間を空けることを保証することができる.

Animation showing box draw, select and delete actions

The animation above shows the supported tool actions, highlighting mouse actions with a circle around the cursor and key strokes by showing the pressed keys. The BoxEditTool can Add, Move and Delete boxes on plots:

追加ボックス

Shiftキーを押し、描画上の任意の位置でクリックしてドラッグしたり、ダブルクリックして描画を開始したり、マウスを移動させて再びダブルクリックして描画を完了します。

移動枠

既存のボックスをクリックしてドラッグします。マウスボタンを離すと箱が落ちます

削除ボックス

1つの枠に軽く触れて選択し、マウスが描画領域にあるときにチェックボタンを押します。

至る Move あるいは…。 削除 一度に複数の箱:

移動選定内容

Shift+Tap(または他の選択ツール)を使用してボックスを選択し、描画上の任意の位置までドラッグします。特定のボックスを選択してドラッグすると、2つのボックスが同時に移動します。

選定内容を削除する

Shift+Tap(または他の選択ツール)を用いてボックスを選択し,マウスが描画領域に位置するときにBackspaceを押す.

FreehandDrawTool

  • 名前: 'freehand_draw'

  • メニューアイコン: freehand_draw_icon

♪the FreehandDrawTool コントロールは手で線と多角形を描くことを可能にする。 Patches そして MultiLine 字形にして、基礎を編集することで ColumnDataSource データです。他の描画ツールと同様に、編集するレンダラは、リスト形式で明示的に提供されなければならない。

r = p.multi_line('xs', 'ys' source=source)
tool = FreehandDrawTool(renderers=[r])

このツールはデータソースを自動的に修正し xs そして ys 字形の値。データソースの他の列は宣言されます empty_value 新しい点を追加した場合。新たに追加されたパッチや複数の行はすべて挿入されます ColumnDataSource 最初のレンダラーを提供します。

例えば、特定の数の関心領域が指定された場合、描画可能な要素の数を制限することも一般的に有用である。使用 num_objects 属性は,制約に達すると,最も古いパッチ/複数行がキューからポップアップされ,追加する新しいパッチ/複数行のための空間を確保することができる.

Animation showing freehand drawing and delete actions

上の動画には支持するツール操作が表示されており,押下されたキーを表示することでカーソル周囲の円とキークリックが突出して表示されている.♪the PolyDrawTool できる Draw そして 削除 スライスとマルチライン:

タブ/マルチラインを描画する

クリックしてドラッグすると描画が開始され、マウスキーを離すと描画が完了します。

スライス/複数行の削除

ライトタッチ直線やパッチを選択し,マウスが描画領域に位置するときにチェックボタンを押す.

至る 削除 一度に複数のスライス/線:

選定内容を削除する

Shift+Tap(または他の選択ツール)を用いてパッチ/ラインを選択し,マウスが描画領域に位置するときにBackspaceキーを押す.

PointDrawTool

  • 名前: 'point_draw'

  • メニューアイコン: point_draw_icon

♪the PointDrawTool 点状のフォントの追加、ドラッグ、削除を可能にします(の XYGlyph タイプ)ベースを編集することによって、1つまたは複数のレンダラ上で ColumnDataSource データです。他の描画ツールと同様に、編集するレンダラは、リスト形式で明示的に提供されなければならない。

c1 = p.circle('x', 'y', 'width', 'height', source=source)
r1 = p.rect('x', 'y', 0.1, 0.1, source=source2)
tool = PointDrawTool(renderers=[c1, r1])

このツールはデータソースを自動的に修正し x そして y 字形の値。データソースの他の列は宣言されます empty_value 新しい点を追加した場合。新たに追加された点はいずれも挿入されます ColumnDataSource 最初のレンダラーを提供します。

描画可能な一次要素の数を制限することも一般的に有用である。使用 num_objects 属性は,制限に達すると,最初の点がキューからポップアップされ,追加する新たな点のための空間を空けることを保証することができる.

Animation showing point draw, drag, select and delete actions

The animation above shows the supported tool actions, highlighting mouse actions with a circle around the cursor and key strokes by showing the pressed keys. The PointDrawTool can Add, Move, and Delete point-like glyphs on plots:

添加点

描画上の任意の位置をクリックします。

移動点.

現在の点を軽く触れてドラッグする。マウスボタンを離すと、その点は破棄される。

削除点.

1つの点に軽く触れて選択し,マウスが描画領域に位置するときにBackspaceキーを押す.

至る Move あるいは…。 削除 一度に複数の点:

移動選定内容

Shift+Tap(または他の選択ツール)を用いて点を選択し,描画上の任意の位置までドラッグする.特定の点を選択してドラッグすると,この2つの点が同時に移動する.

選定内容を削除する

Shift+Tap(または他の選択ツール)を用いて点を選択し,マウスが描画領域に位置するときにBackspaceキーを押す.

PolyDrawTool

  • 名前: 'poly_draw'

  • メニューアイコン: poly_draw_icon

♪the PolyDrawTool 描画、選択、削除を可能にする Patches そして MultiLine 1つ以上のレンダラー上のフォント、方法が編集ベース ColumnDataSource データです。他の描画ツールと同様に、編集するレンダラは、リスト形式で明示的に提供されなければならない。

このツールはデータソースを自動的に修正し xs そして ys 字形の値。データソースの他の列は宣言されます empty_value 新しい点を追加した場合。新たに追加されたパッチや複数の行はすべて挿入されます ColumnDataSource 最初のレンダラーを提供します。

例えば、特定の数の関心領域が指定された場合、描画可能な要素の数を制限することも一般的に有用である。使用 num_objects 属性は,制約に達すると,最も古いパッチ/複数行がキューからポップアップされ,追加する新しいパッチ/複数行のための空間を確保することができる.

もし1つが vertex_renderer 類似点のインジケータが提供されている場合、PolyDrawToolは、それを使用して、提供されるすべてのレンダラ上にマルチライン/スライスの頂点を表示する。これにより、レンダリング時に既存の頂点を捉えることもできる。

Animation showing polygon draw, select and delete actions

The animation above shows the supported tool actions, highlighting mouse actions with a circle around the cursor and key strokes by showing the pressed keys. The PolyDrawTool can Add, Move, and Delete patches and multi-lines:

パッチ/複数行の追加

最初の頂点をダブルクリックで追加し、クリックを使用して各後続頂点を追加します。描画操作を完了するには、最終頂点を挿入するか、Escキーを押すようにダブルクリックしてください。

移動面片/複数行

既存のパッチ/マルチラインを軽くタッチしてドラッグします。マウスボタンを離すと、その点は破棄される。

スライス/複数行の削除

タイル/複数行を軽くタッチして選択し,マウスが描画領域にあるときにチェックボタンを押す.

PolyEditTool

  • 名前: 'poly_edit'

  • メニューアイコン: poly_edit_icon

PolyEditToolは1つ以上の割引ポイントを編集することを可能にする Patches あるいは…。 MultiLine 字形です。編集する字は通過することができます renderers 財産です。頂点のレンダラーは vertex_renderer 類似点の字形にならなければなりません XYGlyph タイプ)。

このツールはデータソースを自動的に修正し xs そして ys 字形の値。データソースの他の列は宣言されます empty_value 新しい点を追加した場合。

Animation showing polygon and vertex drag, select and delete actions

The animation above shows the supported tool actions, highlighting mouse actions with a circle around the cursor and key strokes by showing the pressed keys. The PolyEditTool can Add, Move, and Delete vertices on existing patches and multi-lines:

頂点を示す

既存のタブまたは複数線をダブルクリックします

頂点を加える

既存の頂点をダブルクリックして選択する.このツールは次の点を描くだろう。追加する場合は、新しい位置をクリックしてください。編集を完了して点を追加するには、ダブルクリックしてください。そうでなければ、Escキーを押してキャンセルします。

頂点を移動する

既存の頂点をドラッグし,マウスボタンを外して解放する.

頂点を削除する

1つまたは複数の頂点を選択した後,マウスカーソルが描画領域内にある場合にBackspaceキーを押す.

詳細レベルの制御

HTMLキャンバスは数万から数十万個の字形を容易に表示できるにもかかわらず,インタラクション性能に悪影響を与える可能性がある.大きな(でもそれほど大きくない)データサイズに適応するために,Bokeh Plotはクライアントにおいて“詳細度”(Level of Detail,LOD)機能を提供している.

注釈

非常に大きなデータ量を処理する際に,もう1つの選択は,ブラウザにデータを送信する前にBokeh Serverを用いてデータをダウンサンプリングすることである.一定のデータサイズを超える方法は避けられない。見 Bokehサーバの実行 より多くの情報を得ることができます

その基本的な考え方は、相互作用(例えば、平行移動またはスケーリング)中に、描画は、データ点のごく一部のみを描画することである。これは,インタラクション性能を保ちながら,飛行中にインタラクションの一般的な意味を保持することが期待できる.4つの属性があります Plot LOD行動を制御するオブジェクト:

lod_factor

属性タイプ: Int

詳細レベル抽出に用いる抽出係数を適用する.

lod_interval

属性タイプ: Int

インタラクティブ·ツール·イベントは、詳細度ダウンサンプリングの間隔(ミリ秒単位)を有効にします。

lod_threshold

属性タイプ: Int

いくつかのデータ点は、これらのデータ点を超えて、フォントレンダラは、詳細レベルのダウンサンプリングを実行することができる。とする. None 詳細レベルでのダウンサンプリングを無効にするには、以下の操作を実行してください。

lod_timeout

属性タイプ: Int

インタラクティブなツールイベントがまだ発生しているかどうかのタイムアウト時間(ミリ秒)をチェックする.詳細モードを有効にすると、 lod_timeout お客様。インタラクティブ·ツール·イベントが発生していない場合は、詳細度モードを無効にする。