Upgrade to latest jupyter-book (0.13.1) and add example data.

Author: feilong

docs/_config.yml

@@ -34,78 +34,86 @@ html:
 parse:
   myst_substitutions:
     gallery: |
-      ````{panels}
-      :column: col-4 m-0
-      :body: p-0
-
-      ```{link-button} /examples/save_image
-      :text: Save the high-res image
-      :type: ref
-      :classes: stretched-link btn-block m-0 p-0
-      ```
+      `````{grid}
+
+      ````{grid-item-card}
+      :columns: 4
+      :class-header: bg-light text-center
+      :class-body: text-center m-0 p-0
+      :link-type: doc
+      :link: /examples/save_image
+      Save the high-res image
       ^^^
       ```{glue:figure} save_image
       ```
+      ````
 
-      ---
-
-      ```{link-button} /examples/plot_colorbar
-      :text: Plot a colorbar
-      :type: ref
-      :classes: stretched-link btn-block m-0 p-0
-      ```
+      ````{grid-item-card}
+      :columns: 4
+      :class-header: bg-light text-center
+      :class-body: text-center m-0 p-0
+      :link-type: doc
+      :link: /examples/plot_colorbar
+      Plot a colorbar
       ^^^
       ```{glue:figure} with_colorbar
       ```
+      ````
 
-      ---
-
-      ```{link-button} /examples/different_cmaps
-      :text: Different colormaps
-      :type: ref
-      :classes: stretched-link btn-block m-0 p-0
-      ```
+      ````{grid-item-card}
+      :columns: 4
+      :class-header: bg-light text-center
+      :class-body: text-center m-0 p-0
+      :link-type: doc
+      :link: /examples/different_cmaps
+      Different colormaps
       ^^^
       ```{glue:figure} different_cmaps
       ```
-
       ````
-      ````{panels}
-      :column: col-4 m-0
-      :body: p-0
-
-      ```{link-button} /examples/different_resolutions
-      :text: Different data resolutions
-      :type: ref
-      :classes: stretched-link btn-block m-0 p-0
-      ```
+
+      `````
+
+      `````{grid}
+
+      ````{grid-item-card}
+      :columns: 4
+      :class-header: bg-light text-center
+      :class-body: text-center m-0 p-0
+      :link-type: doc
+      :link: /examples/different_resolutions
+      Different data resolutions
       ^^^
       ```{glue:figure} different_resolutions
       ```
+      ````
 
-      ---
- 
-      ```{link-button} /examples/cortical_masks
-      :text: Handling cortical masks
-      :type: ref
-      :classes: stretched-link btn-block m-0 p-0
-      ```
+      ````{grid-item-card}
+      :columns: 4
+      :class-header: bg-light text-center
+      :class-body: text-center m-0 p-0
+      :link-type: doc
+      :link: /examples/cortical_masks
+      Handle cortical masks
       ^^^
       ```{glue:figure} cortical_masks
       ```
+      ````
 
-      ---
-
-      ```{link-button} /examples/different_surfaces
-      :text: Alternative surface types
-      :type: ref
-      :classes: stretched-link btn-block m-0 p-0
-      ```
+      ````{grid-item-card}
+      :columns: 4
+      :class-header: bg-light text-center
+      :class-body: text-center m-0 p-0
+      :link-type: doc
+      :link: /examples/different_surfaces
+      Alternative surface types
       ^^^
       ```{glue:figure} different_surfaces
       ```
-
       ````
+
+      `````
+
     gallery_link : |
       ---
       [**<< Go back to the gallery of examples**](/examples/index)

docs/examples/cortical_masks.md

@@ -13,7 +13,7 @@ kernelspec:
   name: python3
 ---
 
-# Handling cortical masks
+# Handle cortical masks
 
 Not every vertex on surface belongs to the cerebral cortex.
 There are approximately 8.5% of vertices around the medial wall that are non-cortical.

docs/examples/plot_colorbar.md

@@ -20,23 +20,27 @@ This example shows how to plot a colorbar besides the brain.
 ```{glue:} with_colorbar
 ```
 
+```{margin} Example data
+The example data is a NumPy array combining masked data of both hemispheres, based on a face-selectivity map from [Jiahui et al. (2020)](https://doi.org/10.1016/j.neuroimage.2019.116458) [Figure 5](https://www.sciencedirect.com/science/article/pii/S1053811919310493#fig5).
+```
 ```{code-cell}python
 import numpy as np
-from brainplotlib import brain_plot
+from brainplotlib import brain_plot, example_data
 import matplotlib.pyplot as plt
 
-rng = np.random.default_rng(0)
-v = rng.random((1175, ))
+print(example_data.shape, example_data.dtype)
 ```
 ```{margin} Get color scale information
 The `return_scale` parameter allows returning the color scale information along with the image itself, which can then be used by `plt.colorbar`.
 ```
 ```{code-cell}python
-img, scale = brain_plot(v, vmax=1, vmin=0, cmap='viridis', return_scale=True)
+img, scale = brain_plot(
+    example_data, vmax=10, vmin=-10, cmap='seismic', return_scale=True)
 ```
 ```{code-cell}python
 :tags: ["remove-output"]
-fig = plt.figure(figsize=(img.shape[1] / 300, img.shape[0] / 300), dpi=300)
+fig = plt.figure(
+    figsize=(img.shape[1] / 300, img.shape[0] / 300), dpi=300)
 plt.imshow(img)
 plt.axis('off')
 cbar = plt.colorbar(scale, shrink=0.8, aspect=30)

docs/examples/save_image.md

@@ -74,18 +74,20 @@ cv2.imwrite(
     np.round(img[:, :, reorder] * 255).astype(np.uint8))
 ```
 
-````{tabbed} Using matplotlib
+`````{tab-set}
+````{tab-item} Using matplotlib
 ```python
 import matplotlib.pyplot as plt
-fig = plt.figure(figsize=(img.shape[1] / 200, img.shape[0] / 200), dpi=200)
+fig = plt.figure(
+    figsize=(img.shape[1] / 200, img.shape[0] / 200), dpi=200)
 ax = fig.add_axes([0, 0, 1, 1])
 ax.imshow(img)
 ax.axis('off')
 plt.savefig('save_image_matplotlib.png')
 plt.close()
 ```
 ````
-````{tabbed} Using Pillow
+````{tab-item} Using Pillow
 ```python
 from PIL import Image
 im = Image.fromarray(
@@ -96,7 +98,7 @@ im.save('save_image_pillow.png')
 The code block above requires that the [Pillow package](https://pillow.readthedocs.io/en/stable/index.html) has been installed.
 ```
 ````
-````{tabbed} Using OpenCV
+````{tab-item} Using OpenCV
 ```python
 import cv2
 ## The default channel order of OpenCV is BGR rather than RGB.
@@ -109,25 +111,28 @@ cv2.imwrite(
 The code block above requires that [OpenCV](https://opencv.org/) and its Python bindings to be installed.
 ```
 ````
+`````
 
 ## Comparison of saved images
-````{panels}
-:column: col-4
-
+````{grid}
+```{grid-item-card}
+:class-header: bg-light text-center
 Using matplotlib
 ^^^
 ![](save_image_matplotlib.png)
----
-
+```
+```{grid-item-card}
+:class-header: bg-light text-center
 Using Pillow
 ^^^
 ![](save_image_pillow.png)
----
-
+```
+```{grid-item-card}
+:class-header: bg-light text-center
 Using OpenCV
 ^^^
 ![](save_image_opencv.png)
-
+```
 ````
 
 {{ gallery_link }}

docs/index.md

@@ -9,7 +9,7 @@ It only depends on [`NumPy`](https://numpy.org/) and [`matplotlib`](https://matp
 
 `brainplotlib` can be easily installed with pip
 ```bash
-pip install brainplotlib
+python -m pip install brainplotlib
 ```