<jupyter_start><jupyter_text>交互式数据可视化

Jupyter Notebook 支持多种交互输出，包括 ipywidgets 生态系统以及许多交互式可视化库。在正确的配置下，Jupyter Book支持这些功能。本页有一些常见的例子。

首先，我们将下载一些数据并显示其结构：<jupyter_code>import plotly.express as px
data = px.data.iris()
data.head()<jupyter_output><empty_output><jupyter_text>Altair

交互式输出工作的前提是，它们产生的输出具有自包含的 HTML，无需加载任何外部依赖项。请参阅 [`Altair` 安装说明](https://altair-viz.github.io/getting_started/installation.htmlinstallation)，以便使用 Altair 进行设置。下面是一些输出示例。<jupyter_code>import altair as alt
alt.Chart(data=data).mark_point().encode(
    x="sepal_width",
    y="sepal_length",
    color="species",
    size='sepal_length'
)<jupyter_output><empty_output><jupyter_text>Plotly

Plotly 是另一个交互式绘图库，它提供了用于可视化的高级 API。请参阅 [Plotly JupyterLab 文档](https://plotly.com/python/getting-started/JupyterLab-Support-(Python-3.5+))，在笔记本中开始使用 Plotly。

```{margin}
Plotly 使用[渲染器在显示绘图时输出不同类型的信息](https://plotly.com/python/renderers/)。尝试使用渲染器来获得你想要的输出。
```

下面是一些输出示例。

:::{important}
为了显示这些 plots，可能需要在 `_config.yml` 中加载 `require.js`：

```yaml
sphinx:
  config:
    html_js_files:
    - https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.4/require.min.js
```
:::<jupyter_code>import plotly.io as pio
import plotly.express as px
import plotly.offline as py

df = px.data.iris()
fig = px.scatter(df, x="sepal_width", y="sepal_length", color="species", size="sepal_length")
fig<jupyter_output><empty_output><jupyter_text>Bokeh

Bokeh 为交互式可视化提供了几个选项，是 PyViz 生态系统的一部分。请参阅 [带有 Jupyter 的 Bokeh 文档](https://docs.bokeh.org/en/latest/docs/user_guide/jupyter.htmluserguide-jupyter) 来开始。

下面是一些输出示例。首先，我们将使用 `output_notebook()` 初始化 Bokeh。这需要放在一个单独的单元格中，以便给 JavaScript 时间加载。<jupyter_code>from bokeh.plotting import figure, show, output_notebook
output_notebook()<jupyter_output><empty_output><jupyter_text>现在我们来绘制我们的图。<jupyter_code>p = figure()
p.circle(data["sepal_width"], data["sepal_length"], fill_color=data["species"], size=data["sepal_length"])
show(p)<jupyter_output><empty_output><jupyter_text>ipywidgets

您也可以在文档中运行 Jupyter Widgets 的代码，交互式 HTML 输出将嵌入到您的端中。请参阅 [ipywidgets 文档](https://ipywidgets.readthedocs.io/en/latest/user_install.html)，了解如何在自己的环境中进行设置。

```{admonition} 小部件通常需要一个内核
注意，`ipywidgets` 的行为倾向于不同于其他交互式可视化库。它们既与 Javascript 交互，也与 Python 交互。`ipywidgets` 中的一些功能可能无法在默认的 Jupyter Book 页面中工作（因为没有运行 Python 内核）。您可以使用用于[远程内核的工具来解决这个问题，比如 thebe](https://thebelab.readthedocs.org)。
```

下面是一些简单的小部件元素。<jupyter_code>import ipywidgets as widgets
widgets.IntSlider(
    value=7,
    min=0,
    max=10,
    step=1,
    description='Test:',
    disabled=False,
    continuous_update=False,
    orientation='horizontal',
    readout=True,
    readout_format='d'
)
tab_contents = ['P0', 'P1', 'P2', 'P3', 'P4']
children = [widgets.Text(description=name) for name in tab_contents]
tab = widgets.Tab()
tab.children = children
for ii in range(len(children)):
    tab.set_title(ii, f"tab_{ii}")
tab<jupyter_output><empty_output>
{'fraction_non_alphanumeric': 0.14162049861495846, 'fraction_numerical': 0.005193905817174515, 'mean_word_length': 7.422740524781341, 'pattern_counts': {'":': 0, '<': 25, '<?xml version=': 0, '>': 25, 'https://': 7, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'chain_length': '6', 'dir': 'jupyter-structured-clean-dedup', 'id': '644096', 'license': 'Apache-2.0', 'n_tokens_mistral': 1466, 'n_tokens_neox': 1545, 'n_words': 161, 'path': 'interactive/interactive.ipynb', 'repo_name': 'xinetzone/jupyter-book', 'size': '2888'}