使用CustomJS通过Bokeh制作动态散点图-问题“列名不存在”

时间:2018-11-13 18:51:46

标签: python bokeh

我以为我找到了一个可以利用here的具体示例,但是不幸的是,同样的逻辑对我没有用。

我有两个问题:

  • 这就是我正在尝试做的事情:在html文档中发送动态散点图,使您可以控制在x和y轴上绘制的内容。我已经成功完成了静态图,但是还没有破解动态图。

  • 我的代码在哪里出错(请参见下文?)

这是相关的代码段(按顺序。我有一个数据框,已使用ColumnDataSource将其转换为“源”。

我创建一个初始图(请注意,此时,没有名为“ x”和“ y”的列。稍后我将在回调函数中创建这些列):

plot.circle('x', 'y',
            source=source,
            color={'field': 'Picker',
                    'transform': mapper},
                    legend='Picker')

我创建了两个下拉菜单(请注意,每个菜单中的选项都与希望人们能够选择的“来源”中的列相对应)

x_menu=Select(options=['Box Office', 'Difference', 'Price Paid'],
                        value='Box Office',
                         title='What do you want to put on the x axis')

y_menu=Select(options=['Metacritic', 'Rotten Tomatoes'],
                        value='Metacritic',
                         title='What do you want to put on the y axis')

我创建回调:

callback = CustomJS (args=dict(source=source), code="""
    console.log('changed selected option', cb_obj.value)
    var data=source.data
    data['x']=data[cb_obj.value]
    data['y']=data[cb_obj.value]
    source.change.emit();
    """)

我将回调分配给下拉菜单:

x_menu.callback = callback
y_menu.callback = callback

然后我尝试显示该情节:

show(row(widgetbox(x_menu, y_menu), plot))

但是它返回以下错误:

ERROR:bokeh.core.validation.check:E-1001 (BAD_COLUMN_NAME): Glyph refers to nonexistent column name: x, y [renderer: GlyphRenderer(id='df96b108-e2e4-4b8c-b0c6-12df40b4205d', ...)]

非常感谢您的帮助。谢谢!

1 个答案:

答案 0 :(得分:0)

如果您给出一个独立的最小示例(我们可以仅复制,粘贴和运行的代码),将更容易提供帮助。话虽如此,这可能会帮助您入门。您已经非常接近此解决方案,但是我想重要的部分是每个菜单都有一个回调。

我希望这会有所帮助:-)

# -*- coding: utf-8 -*-
import numpy as np
import pandas as pd

from bokeh.layouts import row, widgetbox
from bokeh.models import CustomJS, Select
from bokeh.plotting import figure, show, ColumnDataSource

# Define some random data
dataframe = pd.DataFrame({
    'Difference': np.sin(np.linspace(0, 100, 500)),
    'Price': np.cos(np.linspace(0, 100, 500)),
    'Metacritic': np.sin(np.linspace(0, 100, 500)),
    'Rotten Tomatoes': np.cos(np.linspace(0, 200, 500)),
    })

# Set x and y-axis defaults
dataframe['x'] = dataframe['Difference']
dataframe['y'] = dataframe['Metacritic']

# Create Bokeh's ColumnDataSource
source = ColumnDataSource(data=dataframe)

# Create the plot figure
plot = figure(plot_width=400, plot_height=400)
plot.circle('x', 'y', source=source)

# Create the dropdown menus
x_menu = Select(options=['Difference', 'Price'],
                value='Difference',
                title='What do you want to put on the x axis')

y_menu = Select(options=['Metacritic', 'Rotten Tomatoes'],
                value='Metacritic',
                title='What do you want to put on the y axis')

# Create two callbacks, one for each menu
callback_x = CustomJS(args=dict(source=source), code="""
    console.log('changed selected option', cb_obj.value)
    var data=source.data
    data['x']=data[cb_obj.value]
    source.change.emit();
    """)

callback_y = CustomJS(args=dict(source=source), code="""
    console.log('changed selected option', cb_obj.value)
    var data=source.data
    data['y']=data[cb_obj.value]
    source.change.emit();
    """)

# Assign callbacks to menu widgets
x_menu.callback = callback_x
y_menu.callback = callback_y

# Show the html document with a layout
show(row(widgetbox(x_menu, y_menu), plot))