散景 - 同一页面上的多个数字

时间:2016-10-08 06:48:13

标签: django bokeh

我需要在页面上有2个散景图。我需要他们彼此分开。目前我只能有一个数字(使用网格/行/列的多个图)但不能有多个数字。

3 个答案:

答案 0 :(得分:1)

请参阅documentation,了解如何在行或列中附加数字。

有关如何在同一行中绘制图形的示例,请参阅

from bokeh.io import output_file, show
from bokeh.layouts import row
from bokeh.plotting import figure

output_file("layout.html")

x = list(range(11))
y0 = x
y1 = [10 - i for i in x]
y2 = [abs(i - 5) for i in x]

# create a new plot
s1 = figure(plot_width=250, plot_height=250, title=None)
s1.circle(x, y0, size=10, color="navy", alpha=0.5)

# create another one
s2 = figure(plot_width=250, plot_height=250, title=None)
s2.triangle(x, y1, size=10, color="firebrick", alpha=0.5)

# create and another
s3 = figure(plot_width=250, plot_height=250, title=None)
s3.square(x, y2, size=10, color="olive", alpha=0.5)

# put the results in a row
show(row(s1, s2, s3))

同样,您可以使用

将结果放在一列中
show(column(s1, s2, s3))

当然,您可以将两者结合起来创建一个网格,所以如果你有一个数字列表,比如graphs,你可以做类似的事情

cols = []
row_num = 3
for i in range(0, len(graphs), row_num):
    r = row(graphs[i: i + row_num])
    cols.append(r)
show(column(cols))

答案 1 :(得分:0)

Try having different script and div tag for the plots.

Example using Django:
from django.shortcuts import render_to_response
from bokeh.plotting import figure,output_file,show
from bokeh.embed import components
import random

**Define your View function this way**

def plot(request,*args,**kwargs):

    PLOT_OPTIONS = dict(plot_width=800, plot_height=300)
    SCATTER_OPTIONS = dict(size=12, alpha=0.5)
    data = lambda: [random.choice([i for i in range(100)]) for r in range(10)]
    red = figure(sizing_mode='scale_width', tools='pan', **PLOT_OPTIONS)
    red.scatter(data(), data(), color="red", **SCATTER_OPTIONS)
    blue = figure(sizing_mode='fixed', tools='pan', **PLOT_OPTIONS)
    blue.scatter(data(), data(), color="blue", **SCATTER_OPTIONS)
    green = figure(sizing_mode='scale_width', tools='pan', **PLOT_OPTIONS)
    green.scatter(data(), data(), color="green", **SCATTER_OPTIONS)
    script1, div1 = components(red)
    script2, div2 = components(blue)
    script3, div3 = components(green)
    context = {'script1':script1,'div1':div1,'script2':script2,'div2':div2,'script3':script3,'div3':div3}
    return render_to_response('graph.html',context=context)

**Then your Template should look like this:**

first load the dependencies inside the HEAD tag 

    <link href="http://cdn.bokeh.org/bokeh/release/bokeh-1.3.4.min.css" rel="stylesheet" type="text/css">
    <link href="http://cdn.bokeh.org/bokeh/release/bokeh-widgets-1.3.4.min.css" rel="stylesheet" type="text/css">

    <script src="http://cdn.bokeh.org/bokeh/release/bokeh-1.3.4.min.js"></script>
    <script src="http://cdn.bokeh.org/bokeh/release/bokeh-widgets-1.3.4.min.js"></script>
    {{ script1 | safe }}
    {{ script2 | safe }}
    {{ script3 | safe }}

Inside the body or wherever you want to display the plots
 <div> {{ div1 | safe }} </div>
  <div> {{ div2 | safe }}  </div>
 <div>  {{ div3 | safe }} </div>

答案 2 :(得分:-1)

from bokeh.plotting import figure
from bokeh.embed import file_html
from bokeh.resources import CDN

x = [1,4,6]
y = [4,6,9]
plot = figure(width=300, height=300)
plot.line(x, y)
html1 = file_html(plot, CDN, 'my plot')

通过这种方式,您可以创建多个图并使用标准的jinja2语法

插入它们

像:

<h1> First plot </h1>
{{ html1 }}
<h1> Second plot </h1>
{{ html2 }}

您可以找到更多信息here

您也可以尝试使用Tab Panels