modified ColumnDataSourceを保存

Question

フラスコとボケを使用して、ユーザーが手動でデータを分類できるWebアプリケーションを構築しようとしています。現在のUIでは、カスタムJavaScriptコールバックを使用して視覚的に変更を行いますが、javascriptを使用して投稿要求をフラスコアプリに送信してユーザーのアクティビティを記録する方法がわかりません。

私は検討したいと思うでしょう代替ソリューションはColumnDataSourceは、彼らが特定のページを終了したら、ユーザーがダウンロードすることができます.csvファイルに変換することですが、私は後にColumnDataSourceにアクセスするかどうかはわかりませんフラスコ内のAPI呼び出し。

私が達成しようとしている基本的な例を紹介しました。

from bokeh.embed import file_html 
from bokeh.events import DoubleTap 
from bokeh.models import CategoricalColorMapper, ColumnDataSource, CustomJS 
from bokeh.plotting import figure 
from bokeh.resources import CDN 
from flask import Flask 
import numpy as np 

# color map 
cmap = CategoricalColorMapper(
    factors=[0, 1], 
    palette=['red', 'green'] 
) 

# custom javascript callback 
js_code = """ 
    var x = cb_obj['x']; 
    var left = src.data['left']; 
    var right = src.data['right']; 
    var color = src.data['color']; 
    for (i=0; i < left.length; i++) { 
     if ((x > left[i]) && (x < right[i])) { 
      var c = color[i] 
      if (c < 1) { 
       color[i] = 1 
      } else { 
       color[i] = 0 
      } 
     } 
    } 
    src.data['color'] = color 
    src.trigger('change') 
""" 

# flask app 
app = Flask(__name__) 

@app.route("/") 
def main(): 
    N = 10 
    left = np.arange(N) 
    right = left + 1 
    color = np.random.randint(2, size=N) 

    src = ColumnDataSource({ 
     'left': left, 
     'right': right, 
     'color': color 
    }) 

    fig = figure(
     width=500, height=200, 
     title='Double Click to Change Color' 
    ) 
    fig.quad(
     'left', 'right', 0, 1, 
     source=src, 
     fill_color={'field': 'color', 'transform': cmap}, 
     line_color='black' 
    ) 

    callback = CustomJS(code=js_code, args={'src': src}) 
    fig.js_on_event(DoubleTap, callback) 
    title = 'test' 
    html = file_html(fig, CDN, title) 

    return html 

if __name__ == "__main__": 
    app.run(debug=True) 

お読みいただきありがとうございます！

Answer 1

JSからPOSTリクエストを送信する場合は、XMLHttpRequestを使用できます。

しかし、あなたのシナリオでは、私はボケサーバ（example of usage with Flask）を使用したい - あなたは変更をトリガした後、あなたの例からColumnDataSourceがボケサーバと同期されるように、この方法は、あなたが手動POSTリクエストを必要はありません（ただし、「トリガー」は推奨されていません。src.change.emit()を使用してください）。

カスタムGETハンドラで

、あなたがget_model_by_nameを使用してボケサーバー上のボケの文書のいずれかのモデルにアクセスすることができます。

@app.route('/cds-data/<cds_name>') 
def get_cds_data(cds_name): 
    data = curdoc().get_model_by_name(cds_name).data 
    return some_dict_to_csv_string_function_you_have_to_write(data) 

それでもボケサーバーを使用しない場合、あなたはまだありませんPOSTリクエストが必要です。データを文字列に変換して、ここの例のように使用できます：https://stackoverflow.com/a/29534664/564509