在散景中添加按钮

在本文中，我们将学习如何在散景中添加按钮。现在，Bokeh 为我们提供了各种可用于各种目的的小部件。其中之一是按钮。该按钮是 bokeh.models 模块的小部件之一，可帮助我们在Python笔记本中创建按钮。让我们看一个例子，以便更好地理解这个概念。但在此之前，如果您使用本地设备进行上述实现，请确保在设备中安装了Python ，然后在命令提示符中运行此代码，以便散景功能在代码编辑器中正常工作。

pip install bokeh

安装完成后，让我们转到代码并学习实现。

示例 1：在 Bokeh 中添加按钮：

方法：

在下面的代码中，除了导入 show 和 button 之外，我们还在我们的Python shell 中导入了另一个包，那就是 customJS。 customJS 为用户提供自定义行为以响应特定事件的变化。这是一个适用于散景服务器应用程序的 javascript 回调。在实现中，我们将使用js_on_click(handler)为按钮点击设置一个 javascript 处理程序。它在创建的按钮被点击时激活，在其中，customJS 将用作处理程序，消息将在控制台中打印。

js_on_click(handler)

代码：

Python3

# importing show from bokeh.io
# to show the button
from bokeh.io import show
  
# importing button and customJS package
# from bokeh.models
from bokeh.models import Button, CustomJS
  
# Creating a button variable where
# we are specifying the properties of the
# button such as label on the button and
# the button type(Different color)
button = Button(label = "Click on the button",
                button_type = "danger")
  
# js_on_click sets up a javascript handler
# for state changes and also when we 
# are clicking on the button. a message
# is printed on the console
button.js_on_click(CustomJS(code = "console.log('button: You have clicked on the button!')"))
  
# showing the above button
show(button)

输出：

代码说明：

现在，在代码中，在导入包并创建一个变量（按钮）后，我们在其中指定按钮的不同属性，我们正在使用用于按钮单击的 js_on_click 处理程序。因此，只要有人点击按钮，处理程序就会被触发，然后 customJS 回调激活并在控制台中打印消息，可以通过鼠标右键单击使用“检查元素”进行检查。

现在，我们可以添加不同颜色的按钮，例如警告（黄色） 、成功（黄色） 、主要（蓝色）等。

示例 2：在 Bokeh 中添加多个按钮。

让我们再举一个例子，我们将在绘图中按行和列添加多个按钮。在下面的代码中，我们从bokeh.layouts模块导入一个包，称为row ，它帮助我们以行方式显示按钮。

代码：

Python

# importing show from bokeh.io
from bokeh.io import show
  
# importing Button from bokeh.models
# module
from bokeh.models import Button
  
# importing row from bokeh.layouts module
# so that buttons can be shown side by side
from bokeh.layouts import row
  
# Creating a list of buttons with defining different properties
# in each of the buttons
buttons = [Button(label="Button 1", button_type="danger"),
            Button(label='Button 2', button_type='success', width=200, height=60),
                Button(label='Button 3', button_type='primary', width=100, height=100)]
  
# Showing all the buttons rowwise
show(row(buttons))

输出：

代码说明：

在上面的代码中，在导入所有必需的包后，我们使用了可变按钮，它是一个数组或 3 个按钮的列表，每个按钮具有不同的大小、颜色和标签。之后使用show(row(buttons)) ， e 以“行”方式显示所有按钮。

除此之外，我们还可以按列格式显示所有按钮。为此，我们需要从bokeh.layouts导入column包，而不是 show(row(buttons))，我们需要编写 show(column(buttons)) 并且所有按钮都将按列打印。