Jupyter notebooks#

你还可以使用 MyST-NB Sphinx 扩展通过 Jupyter Notebooks 创建内容。

本页展示了一些与此主题兼容的额外功能。

Markdown + notebooks#

由于它是 Markdown 格式,你可以在文章中嵌入图片、HTML 等内容!

你也可以插入数学公式,例如 \(add_{math}\)

\[ math^{blocks} \]

或者

\[\begin{split} \begin{align*} \mbox{mean} la_{tex} \\ \\ math blocks \end{align*} \end{split}\]

But make sure you $Escape $your $dollar signs $you want to keep!

代码块和图片输出#

Jupyter Book 还会将你的代码块和输出嵌入到你的书中。例如,以下是一些示例 Matplotlib 代码:

Hide code cell content
from matplotlib import rcParams, cycler
import matplotlib.pyplot as plt
import numpy as np
# Fixing random state for reproducibility
np.random.seed(19680801)

N = 10
data = [np.logspace(0, 1, 100) + np.random.randn(100) + ii for ii in range(N)]
data = np.array(data).T
cmap = plt.cm.coolwarm
rcParams['axes.prop_cycle'] = cycler(color=cmap(np.linspace(0, 1, N)))


from matplotlib.lines import Line2D
custom_lines = [Line2D([0], [0], color=cmap(0.), lw=4),
                Line2D([0], [0], color=cmap(.5), lw=4),
                Line2D([0], [0], color=cmap(1.), lw=4)]

fig, ax = plt.subplots(figsize=(10, 5))
lines = ax.plot(data)
ax.legend(custom_lines, ['Cold', 'Medium', 'Hot']);
../_images/cefbdee9d4d9534f9d0e2dd4b010de5710848a972bd31d1a9a8f407309bfdae1.png

请注意,上面的图像是被捕捉并显示的。

../_images/464eca7405158573e1ae775c29c364cfad54c9e33bcf44fbe48a4e385116b110.png
print("this works for code cells too, if you add a `margin` tag to them")
this works for code cells too, if you add a `margin` tag to them
# You can also include enriched outputs like Math
from IPython.display import Math
Math("\sum_{i=0}^n i^2 = \frac{(n^2+n)(2n+1)}{6}")
<>:3: SyntaxWarning: invalid escape sequence '\s'
<>:3: SyntaxWarning: invalid escape sequence '\s'
/tmp/ipykernel_19095/3100786677.py:3: SyntaxWarning: invalid escape sequence '\s'
  Math("\sum_{i=0}^n i^2 = \frac{(n^2+n)(2n+1)}{6}")
\[\displaystyle \sum_{i=0}^n i^2 = rac{(n^2+n)(2n+1)}{6}\]

发布前移除内容#

在将您的书籍发布到网络之前,您也可以移除一些内容。例如,在./notebooks.md 中,曾经有单元格在下面..."

您也可以 仅移除代码,以便图像和其他输出仍然显示。

下面将 展示图像。它是由单元格中的 Python 代码生成的,您可以在原始笔记本中查看

thisvariable = "this plot *will* show up in the textbook."

fig, ax = plt.subplots()
x = np.random.randn(100)
y = np.random.randn(100)
ax.scatter(x, y, s=np.abs(x*100), c=x, cmap=plt.cm.coolwarm)
ax.text(0, .5, thisvariable, fontsize=20, transform=ax.transAxes)
ax.set_axis_off()
../_images/35a4b795d9a186df66871c6e7413ea26a6fc1d55eccfb6c0d889dd889690287e.png

在这里,将 展示 Pandas DataFrame。

import pandas as pd
df = pd.DataFrame([['hi', 'there'], ['this', 'is'], ['a', 'DataFrame']], columns=['Word A', 'Word B'])
df
Word A Word B
0 hi there
1 this is
2 a DataFrame

您甚至可以为Pandas DataFrame设置样式!更多信息请参阅Pandas样式文档

Hide code cell source
import pandas as pd

np.random.seed(24)
df = pd.DataFrame({'A': np.linspace(1, 10, 10)})
df = pd.concat([df, pd.DataFrame(np.random.randn(10, 4), columns=list('BCDE'))],
               axis=1)
df.iloc[3, 3] = np.nan
df.iloc[0, 2] = np.nan

def color_negative_red(val):
    """
    Takes a scalar and returns a string with
    the css property `'color: red'` for negative
    strings, black otherwise.
    """
    color = 'red' if val < 0 else 'black'
    return 'color: %s' % color

def highlight_max(s):
    '''
    highlight the maximum in a Series yellow.
    '''
    is_max = s == s.max()
    return ['background-color: yellow' if v else '' for v in is_max]

df.style.\
    applymap(color_negative_red).\
    apply(highlight_max).\
    set_table_attributes('style="font-size: 10px"')
/tmp/ipykernel_19095/645148677.py:27: FutureWarning: Styler.applymap has been deprecated. Use Styler.map instead.
  applymap(color_negative_red).\
  A B C D E
0 1.000000 1.329212 nan -0.316280 -0.990810
1 2.000000 -1.070816 -1.438713 0.564417 0.295722
2 3.000000 -1.626404 0.219565 0.678805 1.889273
3 4.000000 0.961538 0.104011 nan 0.850229
4 5.000000 1.453425 1.057737 0.165562 0.515018
5 6.000000 -1.336936 0.562861 1.392855 -0.063328
6 7.000000 0.121668 1.207603 -0.002040 1.627796
7 8.000000 0.354493 1.037528 -0.385684 0.519818
8 9.000000 1.686583 -1.325963 1.428984 -2.089354
9 10.000000 -0.129820 0.631523 -0.586538 0.290720

在标题前测试边距

交互式输出#

甚至可以对 交互式 内容做同样的事情。下面将使用folium显示一张地图。当笔记本转换为Markdown时,创建交互式地图的代码会被保留。

请注意,这仅适用于某些包。 它们需要能够输出独立的 HTML/JavaScript,而不依赖于底层的 Python 内核来运行。

import folium
m = folium.Map(
    location=[45.372, -121.6972],
    zoom_start=12,
    tiles='Stamen Terrain',
    attr="Placeholder attr"
)

folium.Marker(
    location=[45.3288, -121.6625],
    popup='Mt. Hood Meadows',
    icon=folium.Icon(icon='cloud'),
    attr="Placeholder attr"
).add_to(m)

folium.Marker(
    location=[45.3311, -121.7113],
    popup='Timberline Lodge',
    icon=folium.Icon(color='green')
).add_to(m)

folium.Marker(
    location=[45.3300, -121.6823],
    popup='Some Other Location',
    icon=folium.Icon(color='red', icon='info-sign'),
    attr="Placeholder attr"
).add_to(m)


m
Make this Notebook Trusted to load map: File -> Trust Notebook

来自笔记本单元格的丰富输出#

因为笔记本具有丰富的文本输出,你也可以将这些内容存储在你的 Jupyter Book 中!

# The ! causes this to run as a shell command
!jupyter -h
usage: jupyter [-h] [--version] [--config-dir] [--data-dir] [--runtime-dir]
               [--paths] [--json] [--debug]
               [subcommand]

Jupyter: Interactive Computing

positional arguments:
  subcommand     the subcommand to launch

options:
  -h, --help     show this help message and exit
  --version      show the versions of core jupyter packages and exit
  --config-dir   show Jupyter config dir
  --data-dir     show Jupyter data dir
  --runtime-dir  show Jupyter runtime dir
  --paths        show all Jupyter paths. Add --json for machine-readable
                 format.
  --json         output paths as machine-readable json
  --debug        output debug information about paths

Available subcommands: execute kernel kernelspec migrate run troubleshoot
trust

代码单元格的格式化#

滚动单元格输出#

传统的 Jupyter Notebook 界面允许你为单元格切换 输出滚动 功能。这使你能够查看部分长输出的内容,而不必占用整个页面。

你可以在 Jupyter Book 中通过向单元格的元数据添加以下标签来触发此行为:

{
    "tags": [
        "scroll-output",
    ]
}

例如,以下单元格的输出很长,但在书中将可滚动:

for ii in range(40):
    print(f"this is output line {ii}")
this is output line 0
this is output line 1
this is output line 2
this is output line 3
this is output line 4
this is output line 5
this is output line 6
this is output line 7
this is output line 8
this is output line 9
this is output line 10
this is output line 11
this is output line 12
this is output line 13
this is output line 14
this is output line 15
this is output line 16
this is output line 17
this is output line 18
this is output line 19
this is output line 20
this is output line 21
this is output line 22
this is output line 23
this is output line 24
this is output line 25
this is output line 26
this is output line 27
this is output line 28
this is output line 29
this is output line 30
this is output line 31
this is output line 32
this is output line 33
this is output line 34
this is output line 35
this is output line 36
this is output line 37
this is output line 38
this is output line 39

滚动单元格输入#

如果你的输入代码很长并占据了页面的大部分空间,你可以通过向单元格的元数据添加以下标签来使其可滚动:

{
    "tags": [
        "scroll-input",
    ]
}

例如,以下单元格的输入很长,但在书中将可滚动:

b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
b = "This line has no meaning"
print(b)
This line has no meaning