Question

想象一下，我有2个（或更多）具有相同列数和行数的数据源：

#Data
dates = [date(2016, i, 1) for i in range(1,13)]

data1 = pd.DataFrame(index = dates, data = random.randn(12, 2),
                     columns = ['A', 'B'])

data2 = pd.DataFrame(index = dates, data = random.randn(12, 2),
                     columns = ['A', 'B'])

我想绘制A＆amp;列; B在散景中如此：

#Bokeh
source = ColumnDataSource(source1)
source1 = ColumnDataSource(data1)
source2 = ColumnDataSource(data2)

p = figure(x_axis_type = 'datetime')
l1 = p.line(source = source, x = dates, y= 'A', color = 'Red')
l2 = p.line(source = source, x = dates, y= 'B', color = 'Blue')

我有一个下拉列表：

select = Select(options = ['source1', 'source2'], value = 'source1')

为select创建回调的最简单方法是什么，以便在下拉列表中选择不同的选项时，折线图中的数据源会发生变化？我几乎没有JS的经验，也无法真正回避回调，所以任何帮助都会受到赞赏。

修改

我试过这个：

codes = """
var f = cb_obj.get('value');
var sdata = source.data;
var 1data = source1.data;
var 2data = source2.data;

if (f == "source1") {
sdata = 1data ;
source.trigger('change');
};

if (f == "source2") {
sdata = 2data ;
source.trigger('change');
};


"""

select.callback= CustomJS(args= dict(source = source, source1=source1,
                          source2=source2), code = codes)

但它不起作用......

Answer 1

编辑： const FETCH_INTERVAL = 30000; // pull every 30 secs class MyService { public myFeeds: Observable < Feed[] > constructor(private http: Http) { this.myFeeds = Observable.timer(0, FETCH_INTERVAL) .switchMap(() => this.http.get(this.rssToJsonServiceBaseUrl + url)) .map(this.extractFeeds.bind(this)) .catch(this.handleError.bind(this)) .share(); // share to avoid recreating an observable on every subscribtion } private extractFeeds(resp: Response): Feed[] { // do stuff (check for duplicates, etc...) return feeds; } private handleError(err) { // do stuff } }已更改为散景0.12.6，现已弃用，新语法为obj.trigger('change',arg)，请参阅Bokeh releases

您可以清空“源”数据列并使用.push（）

在for循环中重新填充它们

此外，您不应使用以数字

开头的变量名称

obj.change.emit(arg)

编辑以回复评论

codes = """
var f = cb_obj.get('value');
var sdata = source.data;
var data1 = source1.data;
var data2 = source2.data;

if (f == "source1") {
sdata["A"] = [] ;
for (i=0;i<data1["A"].length; i++) {
sdata["A"].push(data1["A"][i]);
}
sdata["B"] = [] ;
for (i=0;i<data1["B"].length; i++) {
sdata["B"].push(data1["B"][i]);
}
source.trigger('change');
};

if (f == "source2") {
sdata["A"] = [] ;
for (i=0;i<data2["A"].length; i++) {
sdata["A"].push(data2["A"][i]);
}
sdata["B"] = [] ;
for (i=0;i<data2["B"].length; i++) {
sdata["B"].push(data2["B"][i]);
}
source.trigger('change');
};
"""

行console.log（）不是必需的，但您可以使用它来帮助自己理解/调试回调，这些是浏览器控制台中的print语句（右键单击 - ＆gt; inspect - ＆gt; Console）< / p>

用回调改变散景中的情节源

1 个答案: