How to make a code cell collapsible in the Jupyter Book?#

  1. In the title bar above: View –> Cell Toolbar –> Edit Metadata

  2. An Edit Metadata button will appear on the upper right corner of all the cells. Click that button for the cell you would like to expand/collapse in your preprint.

  3. Make the following addition:

{
   "tags": [
      "hide-input"
    ]
}

Please visit Jupyter Book documentation for more information about the Book content and syntax.

Hide code cell source 
print("This code cell will be hidden in the Jupyter Book.")

This code cell will be hidden in the Jupyter Book.

How to render interactive figures?#

The code cell below uses Plotly to generate a simple interactive figure. When the Jupyter Book is built, the example figure will be rendered.

import plotly.express as px
from plotly.offline import plot
from IPython.core.display import HTML

# Example dataset 
df = px.data.gapminder()

# Scatter plot with slider
fig = px.scatter(df.query("year==2007"), x="gdpPercap", y="lifeExp", size="pop", color="continent",
           hover_name="country", log_x=True, size_max=60)

# fig.show() # You can use this command for inline rendering as you are developing your notebook.

plot(fig, filename = 'example_figure.html')
display(HTML('example_figure.html'))