Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >使用bokeh/flexx pyscript在Python3.5中的交互式浏览器绘图

使用bokeh/flexx pyscript在Python3.5中的交互式浏览器绘图
EN

Stack Overflow用户
提问于 2016-05-08 01:24:20
回答 1查看 777关注 0票数 1

维护人员的注意: pyscript支持被废弃,并将在Bokeh2.0中删除

我目前正在学习Python,并试图制作一个在浏览器上运行的交互式仪表板。我使用Bokeh进行可视化,使用flexx/pyscript进行回调交互。第一个目标是创建一个筛选数据集的按钮。我尝试使用滑块示例

guide/interaction.html

我对其进行了修改,只需单击一个按钮就可以更改数据(实际过滤将是步骤2)。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
x = [1,2,3] # dummy data
y = [4,5,6] # dummy data

# output to static HTML file
# output_file("sample.html", title="sample")
source = ColumnDataSource(data=dict(x=x, y=y))
# create a new plot with a title and axis labels
plot = Figure(plot_width=400, plot_height=400)
plot.line('x', 'y', source=source, line_width=3, line_alpha=0.6)


def callback(source=source):
    data = source.get('data')
    f = cb_obj.get('value')
    x, y = data['x'], data['y']
    x = [0.9,0.8,0,7]
    y = [1,2,3]
    source.trigger('change')

button = Button(callback=CustomJS.from_py_func(callback))
button.on_click(source)

layout = vform(button, plot)

show(layout)

页面加载后,我可以单击按钮,但不会触发对情节的更改。您知道如何修改此代码以便通过使用bokeh按钮事件处理程序触发和实际更改吗?我搜索了很多网站,但我找不到一个很好的例子。

提前感谢!

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-05-08 02:22:34

您只需实际更新数据源上的数据即可。

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
def callback(source=source):
    data = source.get('data')
    f = cb_obj.get('value')
    data['x'] = [0.9, 0.8, 0,7]
    data['y'] = [1,   2,   3  ]        
    source.trigger('change')

代码只创建新的vars、xy,然后立即覆盖它们。这实际上并没有更新.data,这正是需要发生的事情。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/37098265

复制
相关文章
JQuery Div scrollTop ScrollHeight
jQuery 里和滚动条有关的概念很多,但是有三个属性和滚动条的拖动有关,就是:scrollTop、scrollLeft、scrollHeight。其中 scrollHeight 属性,互联网上几乎搜素不到关于它的应用技巧,而我正好需要用到它。
全栈程序员站长
2022/09/15
2.8K0
获取页面滚动距离pageYOffset、scrollY、scrollTop
在获取页面滚动距离的高度时候,往往有不同的获取方式,而且不同的属性浏览器支持稍有差别:
用户1349575
2022/02/13
3.8K0
html 滚动条 scrolltop scrollheight,浅谈JavaScript中scrollTop、scrollHeight、offsetTop、offsetHeight…
浅谈JavaScript中scrollTop、scrollHeight、offsetTop、offsetHeight
全栈程序员站长
2022/09/15
2.3K0
html 滚动条 scrolltop scrollheight,浅谈JavaScript中scrollTop、scrollHeight、offsetTop、offsetHeight…
滚动条三要素scrollTop clientHeight scrollHeight
插件 https://github.com/inuyaksa/jquery.nicescroll
全栈程序员站长
2022/09/15
1.3K0
jQuery第二十一篇 scrollTop
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> *{ margin: 0; padding: 0; } .scroll{ width: 100px; height: 200px; border: 1p
贵哥的编程之路
2020/10/28
2910
jQuery scroll(滚动)延迟加载
延迟加载 $(window).scroll(function(){ var scrollHeight = $(document).height(); //文档高度 var scrollTop = $(this).scrollTop(); //滚动条卷去高度 var windowHeight = $(this).height(); // 窗口高度 // console.log(scrollHeight, scrollTop, windowHeight) if(scrol
deepcc
2018/05/16
9.1K0
liMarquee – jQuery无缝滚动插件
liMarquee 是一款基于 jQuery 的无缝滚动插件,类似于 HTML 的 marquee 标签,但比 marquee 更强大。它可以应用于任何 Web 元素,包括文字、图像、表格、表单等元素,同时它可以设置不同的滚动方向(左右上下)、滚动速度、鼠标悬停暂停、鼠标拖动、加载 xml 文件等等。
kirin
2021/01/29
8.9K0
jquery横向滚动条
此代码献给wendy 由于工作太忙,下次再整理成插件调用,先记录下来,欢迎同学们提意见。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" conten
deepcc
2018/05/16
7K0
jquery 页面滚动事件 scroll()
在没有任何元素的情况下,document的宽高是与window的宽高一致的,那么如果给document加入一些元素呢?
Devops海洋的渔夫
2019/06/02
10.1K0
jquery无缝隙连续滚动代码
通常我们在做网页布局的时候,客户为要求在某个地方实现图片滚动或文字滚动的展示,这就是所谓的跑马灯效果,在以前蓝叶用html标签marquee来做跑马灯效果,marquee不是很完美,如果一个层的宽度或高度过长,那么中间会用空隙显得很不美观;现在蓝叶用jquery无缝隙连续滚动代码来实现跑马灯效果,这段jquery无缝隙连续滚动代码可以自由设置,向左、向右、向上、向下的滚动效果,如果你需要就把以下代码复制到你需要的地方,稍微进行修改即可使用了,这是一段jquery代码,需要jquery库的支持才行。
李维亮
2021/07/09
6.8K0
jquery.countup实现数字滚动
效果图 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compa
明知山
2020/09/03
5.4K0
SCrollTOP scrollHeight
jQuery 里和滚动条有关的概念很多,但是有三个属性和滚动条的拖动有关,就是:scrollTop、scrollLeft、scrollHeight。其中 scrollHeight 属性,互联网上几乎搜素不到关于它的应用技巧,而我正好需要用到它。
全栈程序员站长
2022/09/15
2.3K0
SCrollTOP scrollHeight
jQuery实现消息滚动播放的效果
场景需求: 在大屏幕上,消息会进行一个实时滚动播报的效果,将现有的内容进行一个来回滚动的播放~~
王小婷
2021/04/04
4.9K0
jquery 滚轮插件 示例 - 整屏滚动
要做出这个效果,其实不用说,首先要把这五个div的基本HTML+CSS给写出来先。
Devops海洋的渔夫
2019/05/30
4.6K0
jQuery滚动到页面指定位置
        在前端的页面开发中,经常会碰到页面跳转问题,这个跳转指的是页面内部跳转到指定位置,通常是在有滚动条的情况下,网上介绍的方法很多,本文主要是介绍jQuery函数中的一个小trick,.focus()函数。
Tyan
2022/05/09
7K0
jQuery滚动到页面指定位置
jQuery 尺寸、位置操作
​ jQuery中分别为我们提供了两套快速获取和设置元素尺寸和位置的API,方便易用,内容如下。
梨涡浅笑
2022/05/08
1.1K0
jQuery 尺寸、位置操作
scrollTop()方法
大家好,我是架构君,一个会写代码吟诗的架构师。今天说一说scrollTop()方法,希望能够帮助大家进步!!!
Java架构师必看
2022/09/26
1.3K0
scrollTop()方法
Vue 滚动条定位问题
作者:matrix 被围观: 9,147 次 发布时间:2018-06-28 分类:零零星星 | 3 条评论 »
HHTjim 部落格
2022/09/26
9110
Vue 滚动条定位问题
scrollIntoView()方法导致整个页面产生偏移
今天在做页面UI改版的时候发现,我之前使用的是dom.scrollIntoView(); 使得点击右侧题目编号的时候,让左侧题目滚动到页面可视区域。
Daotin
2021/01/21
4.3K0
js常用事件整理—兼容所有浏览器
1.鼠标滚动事件。 说明:返回值 大于0向上滚动,小于0向下滚动。 兼容型:所有浏览器。 代码: /*********************** * 函数:鼠标滚动方向 * 参数:event * 返回:滚轮方向[向上(大于0)、向下(小于0)] *************************/ var scrollFunc = function(e) { var direct = 0; e = e || window.event; if (e.wheelDelta) {//
磊哥
2018/05/08
2.2K0

相似问题

jQuery滚动过远

10

ScrollTop - jQuery不滚动

21

jQuery scrollTop不滚动

40

jQuery .scrollTop没有正确滚动

20

jQuery - scrollTop命令未滚动

12
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
查看详情【社区公告】 技术创作特训营有奖征文