<bdo id='jH2kx'></bdo><ul id='jH2kx'></ul>

    <tfoot id='jH2kx'></tfoot>

    <legend id='jH2kx'><style id='jH2kx'><dir id='jH2kx'><q id='jH2kx'></q></dir></style></legend>
  1. <i id='jH2kx'><tr id='jH2kx'><dt id='jH2kx'><q id='jH2kx'><span id='jH2kx'><b id='jH2kx'><form id='jH2kx'><ins id='jH2kx'></ins><ul id='jH2kx'></ul><sub id='jH2kx'></sub></form><legend id='jH2kx'></legend><bdo id='jH2kx'><pre id='jH2kx'><center id='jH2kx'></center></pre></bdo></b><th id='jH2kx'></th></span></q></dt></tr></i><div id='jH2kx'><tfoot id='jH2kx'></tfoot><dl id='jH2kx'><fieldset id='jH2kx'></fieldset></dl></div>

    1. <small id='jH2kx'></small><noframes id='jH2kx'>

      使用 Bokeh Slider 滑动图像

      时间:2024-04-19
      <i id='8SXBu'><tr id='8SXBu'><dt id='8SXBu'><q id='8SXBu'><span id='8SXBu'><b id='8SXBu'><form id='8SXBu'><ins id='8SXBu'></ins><ul id='8SXBu'></ul><sub id='8SXBu'></sub></form><legend id='8SXBu'></legend><bdo id='8SXBu'><pre id='8SXBu'><center id='8SXBu'></center></pre></bdo></b><th id='8SXBu'></th></span></q></dt></tr></i><div id='8SXBu'><tfoot id='8SXBu'></tfoot><dl id='8SXBu'><fieldset id='8SXBu'></fieldset></dl></div>
        <legend id='8SXBu'><style id='8SXBu'><dir id='8SXBu'><q id='8SXBu'></q></dir></style></legend>
          • <bdo id='8SXBu'></bdo><ul id='8SXBu'></ul>

            <small id='8SXBu'></small><noframes id='8SXBu'>

            <tfoot id='8SXBu'></tfoot>
                <tbody id='8SXBu'></tbody>

                本文介绍了使用 Bokeh Slider 滑动图像的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!

                问题描述

                我正在尝试借助滑块无缝地传达大量科学数据.

                I am trying to convey a large amount of scientific data seamlessly with the help of sliders.

                我从 Bokeh 开始,对 JavaScript 几乎一无所知.我尝试设置第一种方法来滑过两个图像,但我无法刷新图像.

                I am beginning with Bokeh and have close to no knowledge in javascript. I tried to setup a first approach to be able to slide through two images, but I cannot get the image to refresh.

                假设我的文件夹中有 1.png 和 2.png.

                Suppose I have 1.png and 2.png in my folder.

                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)
                

                我改编了 Bokeh Widget Doc 用于滑块和处理散景图像.

                I adapted examples from Bokeh Widget Doc for the slider and working with images in bokeh.

                我的想法是滑块,通过 callbackimg 片段,将修改包含 url 的源,即要加载的图像的名称.我认为,现在,对源中的字符串的简单访问,并通过滑块的当前值进行替换(因此当滑块从 1 变为 2 时,它应该从 1.png 跳到 2.png)应该做这个伎俩.

                My idea is that the slider, through the callbackimg snippet, will modify the source which contains the url, i.e the name of the image to load. I thought, for now, that a simple access to the string in the source, and a replacement through the current value of the slider (so it should jump from 1.png to 2.png as the slider goes from 1 to 2) should do the trick.

                然而,一切都没有改变.我怀疑我在 Javascript 代码段中做错了什么.

                However, nothing is changing. I suspect I am doing something wrong in the Javascript snippet.

                感谢您的反馈

                我根据@bigreddot 的建议编辑了代码,但现在滑块在2"位置滑动时只显示一个空图.在我的回答中解决了这个问题

                I edited the code according to the suggestions of @bigreddot, but now the slider shows simply an empty figure when sliding in position '2'. Solved the issue, in my answer below

                推荐答案

                问题是这样的:

                url = data['url'][0]
                url.replace("1","f")
                

                replace 方法返回一个 new 字符串(您会立即将其丢弃),因此您实际上并未更改列数据源中的任何内容.你需要这样的东西:

                The replace method returns a new string (which you immediately discard), so you are not actually changing anything in the column data source. You need something like:

                old = data['url'][0]
                data['url'] = old.replace("1","f")
                

                这篇关于使用 Bokeh Slider 滑动图像的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!

                上一篇:如何检索和显示滑块范围值? 下一篇:光滑的滑块 - 同步自动播放和活动导航

                相关文章

              • <legend id='5SpHY'><style id='5SpHY'><dir id='5SpHY'><q id='5SpHY'></q></dir></style></legend>

                  1. <i id='5SpHY'><tr id='5SpHY'><dt id='5SpHY'><q id='5SpHY'><span id='5SpHY'><b id='5SpHY'><form id='5SpHY'><ins id='5SpHY'></ins><ul id='5SpHY'></ul><sub id='5SpHY'></sub></form><legend id='5SpHY'></legend><bdo id='5SpHY'><pre id='5SpHY'><center id='5SpHY'></center></pre></bdo></b><th id='5SpHY'></th></span></q></dt></tr></i><div id='5SpHY'><tfoot id='5SpHY'></tfoot><dl id='5SpHY'><fieldset id='5SpHY'></fieldset></dl></div>
                    <tfoot id='5SpHY'></tfoot>
                    • <bdo id='5SpHY'></bdo><ul id='5SpHY'></ul>
                  2. <small id='5SpHY'></small><noframes id='5SpHY'>