수정 된 ColumnDataSource 저장

Question

플라스크 및 보케를 사용하여 사용자가 수동으로 데이터를 분류 할 수있는 웹 응용 프로그램을 작성하려고합니다. UI는 현재 사용자 정의 javascript 콜백을 사용하여 시각적으로 변경 사항을 렌더링하지만 자바 스크립트를 사용하여 게시물 요청을 내 플라스크 응용 프로그램에 보내 사용자의 활동을 기록하는 방법을 잘 모르겠습니다. 내가 생각하고 싶은

대체 솔루션은 사용자들이 특정 페이지를 마친 후 다운로드 할 수있는 .csv 파일로 ColumnDataSource를 변환하는 것입니다,하지만 난 후 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을 사용할 수 있습니다.

그러나이 시나리오에서는 Bokeh 서버 (example of usage with Flask)를 사용합니다.이 예제에서는 ColumnDataSource이 예를 들어 변경을 트리거 한 후 Bokeh 서버와 동기화되므로 수동 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