CODEWITHSUNDEEP
pythonweb-servicesflaskwebserverbokeh
khashishin
khashishin

Reputation: 26

Changing HTML elements from Python on a running Bokeh server instance served by Flask

I've been trying to run Bokeh application server that is handled by Flask.

I run the Bokeh server and embed the application mostly using code from https://github.com/bokeh/bokeh/blob/0.12.14/examples/howto/server_embed/flask_embed.py I changed a few things looking on various topics on stackoverflow and mailing groups and experimented with it for a good few days for now.

Then i sucessfully hooked some callbacks based on on_change properties to my elements:

for w in [offset, amplitude, phase, freq]:
    w.on_change('value', update_data)

def update_data(attrname, old, new):
    # Get the current slider values
    amplitude_value = amplitude.value
    offset_value = offset.value
    phase_value = phase.value
    freq_value = freq.value

    # Generate the new curve
    x = np.linspace(0, 4*np.pi, N)
    y = amplitude_value*np.sin(freq_value*x + phase_value) + offset_value
    source.data = dict(x=x, y=y)

    #Here i would need to find some DIV on the website and change it based on the calculated value
    calculated_thing = calculate_something_really_complicated(amplitude_value,offset_value,phase_value,freq_value)

    #Find a DIV on webpage and change it.

The thing is, I want to get the output values from those sliders (dynamically on change, to the server) and based on that output i want to calculate something in a Python function that I will pass to the HTML element in the resulting page. Using the values here works one time, statically (as intented, as the function only passes once, setting the listeners for those objects). The thing is that those elements I want to change are not Bokeh widgets themselves but rather just DIV's and other HTML elements i have on this webpage. If I could easily create/update DIV's here from Python I think I could also manage.

I am able to get this functionality by e.g. using custom JS Callback on each of the sliders:

w.js_on_change('value', CustomJS(args=dict(amplitude=amplitude, offset=offset, phase=phase, freq=freq),code=js_code))
js_code = """
doc = document.getElementById("dynamic_equation");
doc.textContent = amplitude.value + "sometext" + offset.value;
"""

Unfortunately I am unable to do this thing I want solely with JS as i want to utilize Sympy to calculate me some equations based on those values and return the output.

I can give any clarification and further code needed (its about 130 lines now + the template).

Upvotes: 0

Views: 1021

Answers (1)

Louc
Louc

Reputation: 342

I can't see a good solution, because I don't see how python code can change some html code that is not in its charge. But I think there are several workaround :

  • using a div bokeh widget. It will look like any other div element except that it is generated by bokeh server

  • You can even imagine some dirty tricks to hide the div generated by bokeh, and copy its content to your div with some JS ...

  • For your information, bokeh server can use html template with custom css, but currently limited to the creation of one global div that contains all bokeh document (plots/widgets).. Enhancing this is the goal of the under development feature. It will allow bokeh server to produce code that is used in different part of html template

Upvotes: 1

Related Questions