私は、スライダの助けを借りて、大量の科学データをシームレスに伝達しようとしています。Bokeh Sliderで画像をスライド
私はBokehから始まり、javascriptにはほとんど知らないです。私は、2つの画像をスライドするための最初のアプローチを試みましたが、画像をリフレッシュすることはできません。
私のフォルダに1.pngと2.pngがあるとします。
from bokeh.io import vform
from bokeh.models import CustomJS, ColumnDataSource, Slider
from bokeh.plotting import Figure, output_file, show
output_file('image.html')
source = ColumnDataSource(data=dict(url=['1.png']))
p = Figure(x_range=(0,1), y_range=(0,1))
callbackimg = CustomJS(args=dict(source=source), code="""
var data = source.get('data');
var f = cb_obj.get('value')
old = data['url'][0]
data['url'][0]= old.replace("1","f")
source.trigger('change');
""")
p.image_url('url',source=source, x=0, y=1,w=1,h=1)
slider = Slider(start=1, end=2, value=1, step=1, title="image number", callback=callbackimg)
layout = vform(slider, p)
show(layout)
私はスライダーと working with images in bokehためBokeh Widget Docから例を適応。
私の考えでは、スライダがcallbackimgスニペットを使用して、URLを含むソース、つまり読み込むイメージの名前を変更するという考えがあります。 私は、今のところ、ソース内の文字列への簡単なアクセスと、スライダの現在の値による置換(スライダが1から2になるので、1.pngから2.pngにジャンプする必要がある)トリックを行う必要があります。
ただし、何も変更されていません。私はJavascriptスニペットで何か間違っていると思う。任意のフィードバック
EDITため
ありがとう:私は@bigreddotの提案に応じてコードを編集しますが、位置にスライドするとき、今のスライダーは、単に空の図を示して「2」。 EDIT2: