Flask应用程序中的散景滑块不起作用它仅显示滑块标题

时间:2016-04-21 12:34:11

标签: python flask bokeh

我正在尝试使用滑块渲染散景图。滑块不可见,只有标题,所以它不可用。如何显示滑块?

from __future__ import print_function

import flask

from math import sin,pi
from bokeh.models import Slider,CustomJS,ColumnDataSource
from bokeh.embed import components
from bokeh.plotting import figure
from bokeh.resources import INLINE,CDN
from bokeh.util.string import encode_utf8
from bokeh.io import output_file, show, vform

app = flask.Flask(__name__)

colors = {
    'Black': '#000000',
    'Red':   '#FF0000',
    'Green': '#00FF00',
    'Blue':  '#0000FF',
}

def getitem(obj, item, default):
    if item not in obj:
        return default
    else:
        return obj[item]

x=[x*0.01 for x in range(1000)]
y=[sin(2*pi*1*x) for x in x]
source = ColumnDataSource(data=dict(x=x, y=y))

callback = CustomJS(args=dict(source=source), code="""
        var data = source.get('data');
        var f = cb_obj.get('value')
        x = data['x']
        y = data['y']
        for (i = 0; i < x.length; i++) {
            y[i] = Math.sin(2*Math.pi*x[i]*f)
        }
        source.trigger('change');
    """)

slider = Slider(start=10, end=50, value=1, step=1, title="power",    callback=callback)

@app.route("/")
def polynomial():
    # Grab the inputs arguments from the URL
    # This is automated by the button
    args = flask.request.args

    # Get all the form arguments in the url with defaults
    color = colors[getitem(args, 'color', 'Black')]
    _from = int(getitem(args, '_from', 0))
    to = int(getitem(args, 'to', 10))

    # Create a polynomial line graph
    x = list(range(_from, to + 1))
    fig = figure(title="Polynomial")
    fig.line(x, [i ** 2 for i in x], color=color, line_width=2)
    #fig.add_tools(slider)
    # Configure resources to include BokehJS inline in the document.
    # For more details see:
    #       http://bokeh.pydata.org/en/latest/docs/reference/resources_embedding.html#bokeh- embed
    js_resources = INLINE.render_js()
    css_resources = CDN.render_css()
    #ss=vform(slider)
    elemanlar={'fig':fig,'slider':slider}
    # For more details see:
    #   http://bokeh.pydata.org/en/latest/docs/user_guide/embedding.html#components
    #script, divs = components(fig,INLINE)
    script, divs = components(elemanlar)
    print (divs)
    html = flask.render_template(
        'embed.html',
        plot_script=script,
        plot_div=divs,

        js_resources=js_resources,
        css_resources=css_resources,
        color=color,
        _from=_from,
        to=to
    )
    return encode_utf8(html)

if __name__ == "__main__":
    print(__doc__)
    app.run(debug=True)
<!doctype html>
<html lang="en">
  <head>
      <meta charset='utf-8' />
    <meta http-equiv='content-type' content='text/html; charset=utf-8' />

    <title>Embed Demo</title>

    {{ js_resources|indent(4)|safe }}

    {{ css_resources|indent(4)|safe }}

    {{ plot_script|indent(4)|safe }}

  </head>
  <body>
    <!-- A simple form for changing the graph -->
    <p> Select your settings: </p>
    <form name="color_button" method='GET'>
        Color:
        <select name="color">
            <option value="Red">Red</option>
            <option value="Green">Green</option>
            <option value="Blue">Blue</option>
            <option selected="selected" value="Black">Black</option>
        </select>
        <br>
        From:
        <input type="text" name="_from" value="{{ _from }}">
        <br>
        To:
        <input type="text" name="to" value="{{ to }}">
        <br>
        <button type="submit">Submit</button>

    </form>

    {{ plot_div['fig']|indent(4)|safe }}
      {{plot_div['slider']|safe}}
    <p> Demonstrates some very simple embedding into a webpage</p>
  </body>
</html>

0 个答案:

没有答案