⚠️The latest release refactored our HTML, so double-check your custom CSS rules!⚠️

Jupyter notebooks#

This is a page to demonstrate the look and feel of Jupyter Notebook elements.

Hiding elements#

Hide cells#

The following cell is hidden. It also has a thebe-init tag which means it will be executed when you initialize Thebe.

Hide code cell content
# Generate some code that we'll use later on in the page
import numpy as np
import matplotlib.pyplot as plt

Hide inputs#

Hide code cell source
# Hide input
square = np.random.randn(100, 100)
wide = np.random.randn(100, 1000)

fig, ax = plt.subplots()
ax.imshow(square)

fig, ax = plt.subplots()
ax.imshow(wide)
<matplotlib.image.AxesImage at 0x7f305101c8b0>
../_images/bb0d141f4f0d53146ded603b9757d43bad6017d972c242c0cf00caab931f99ed.png ../_images/3cb3572e20d8f7ae8dafbd3c05990cc578add2ba11e04dc4b731d6b2ca8e2750.png

Hide outputs#

# Hide output
square = np.random.randn(100, 100)
wide = np.random.randn(100, 1000)

fig, ax = plt.subplots()
ax.imshow(square)

fig, ax = plt.subplots()
ax.imshow(wide)
Hide code cell output
<matplotlib.image.AxesImage at 0x7f304efa4f10>
../_images/7c5cbc8070ac7bad381469f7caf943ae6d0560e2a5ee77cdf718d97318605c61.png ../_images/7b9a9e081ac1023c9d510951b894e3733a30bbb8faa670e9c3080802b28186de.png

Hide markdown#

Note

This is a hidden markdown cell

It should be hidden!

Hide both inputs and outputs#

Hide code cell source
square = np.random.randn(100, 100)
wide = np.random.randn(100, 1000)

fig, ax = plt.subplots()
ax.imshow(square)

fig, ax = plt.subplots()
ax.imshow(wide)
Hide code cell output
<matplotlib.image.AxesImage at 0x7f304d66a770>
../_images/e97e00c00fab52950547446f592012b2628ccd7b172882ae20708051f5d2918b.png ../_images/48b0078fcd7e840e3018dc8811ba3b751dfad43e8052fa65c42732eb90083eae.png

Hide the whole cell#

Hide code cell content
square = np.random.randn(100, 100)
wide = np.random.randn(100, 1000)

fig, ax = plt.subplots()
ax.imshow(square)

fig, ax = plt.subplots()
ax.imshow(wide)
<matplotlib.image.AxesImage at 0x7f304d544430>
../_images/9907b87b6690d115d8e635ba1f696c2d39ed4762f26bef6eca20a52d7a7df3a5.png ../_images/fbab2ebccddf199d9e51fae76cafff123b2cf1791cd6c5ddd6be0ad1ed64ee3b.png

Enriched outputs#

Math#

# 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}")
\[\displaystyle \sum_{i=0}^n i^2 = rac{(n^2+n)(2n+1)}{6}\]

Pandas DataFrames#

import pandas as pd
df = pd.DataFrame([['hi', 'there'], ['this', 'is'], ['a', 'DataFrame']], columns=['Word A', 'Word B'])
df
/tmp/ipykernel_781/671471819.py:1: DeprecationWarning: 
Pyarrow will become a required dependency of pandas in the next major release of pandas (pandas 3.0),
(to allow more performant data types, such as the Arrow string type, and better interoperability with other libraries)
but was not found to be installed on your system.
If this would cause problems for you,
please provide us feedback at https://github.com/pandas-dev/pandas/issues/54466
        
  import pandas as pd
Word A Word B
0 hi there
1 this is
2 a DataFrame

Styled DataFrames (see the Pandas Styling docs).

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_781/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

Interactive outputs#

Folium#

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'),
    attr="Placeholder attr"
).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

Stdout#

# 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

Formatting code cells#

Scrolling cell outputs#

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

Scrolling cell inputs#

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