1

我正在尝试为我们的大学创建一个数据仪表板,但遇到了如何呈现的问题。我正在使用 Bokeh 和 Python 创建一些交互式图形。当我单击一个框来选择专业的大学时,我的复选框组没有更新。我尝试过更改几个项目,但无法弄清楚我做错了什么。

我的代码:

# Available college list
available_colleges = list(df['College'].unique())

source_maj = ColumnDataSource(df)
grouped_maj = df.groupby('Major').sum()
source_maj = ColumnDataSource(grouped_maj)
major = source_maj.data['Major'].tolist()

p_maj = figure(x_range=major, width=1100, height=500)
p_maj.xaxis.major_label_orientation = math.pi/4


color_map = factor_cmap(field_name='Major',
                    palette=Magma11, factors=level)

p_maj.vbar(x='Major', top='AY2018_19', source=source_maj, width=0.2, color=color_map)

p_maj.title.text ='Enrollment by Major'
p_maj.xaxis.axis_label = 'Major'
p_maj.yaxis.axis_label = 'Enrolled Students'

hover = HoverTool()
hover.tooltips = [
    ("2019-2020", "@AY2019_20"),
    ("2018-2019", "@AY2018_19"),
    ("2017-2018", "@AY2017_18")]

hover.mode = 'vline'


callback = CustomJS(args=dict(source=source_maj), code="""
    const labels = cb_obj.labels;
    const active = cb_obj.active;
    const data = source_maj.data;
    const sourceLen = data.combined.length;
    const combined = Array(sourceLen).fill(undefined);
    if (active.length > 0) {
        const selectedColumns = labels.filter((val, ind) => active.includes(ind));
        for(let i = 0; i < sourceLen; i++) {
            let sum = 0;
            for(col of selectedColumns){
                sum += Major[col][i];
            }
            combined[i] = sum;
        }
    }
    Major.combined=combined;
    source_maj.change.emit();
""")

colleges_selection = CheckboxGroup(labels=available_colleges, active = [0], callback=callback)

controls = WidgetBox(colleges_selection)
p_maj = row(controls, p_maj)

数据在正在读取的 csv 表中格式化

样本数据

它看起来像什么,但没有更新 当前的图表是什么样的

任何帮助是极大的赞赏。

4

1 回答 1

3

您可能希望查看浏览器发送到 javascript 控制台的输出;它会告诉你这里出了什么问题。

从几个地方开始:CustomJS 对象的参数引入 python 对象“source_maj”并将其重命名为“source”,但随后在 JS 代码中将其称为“source_maj”。此外,您的 JS 代码引用了“Major”,但这不是 JS 知道的对象(即它没有与 args 一起引入)。

于 2019-12-16T18:46:26.570 回答