Note
Go to the end to download the full example code.
Anatomical scan viewer
Generate a brainsprite viewer for an anatomical MRI scan, by populating an html template.
We first download an anatomical scan through one of nilearn’s fetcher:
from nilearn import datasets
# one anatomical scan from the haxby dataset
haxby_dataset = datasets.fetch_haxby()
haxby_anat_filename = haxby_dataset.anat[0]
[fetch_haxby] Added README.md to /home/runner/nilearn_data
[fetch_haxby] Dataset created in /home/runner/nilearn_data/haxby2001
[fetch_haxby] Downloading data from https://www.nitrc.org/frs/download.php/7868/mask.nii.gz ...
[fetch_haxby] ...done. (8 seconds, 0 min)
[fetch_haxby] Downloading data from http://data.pymvpa.org/datasets/haxby2001/MD5SUMS ...
[fetch_haxby] ...done. (0 seconds, 0 min)
[fetch_haxby] Downloading data from http://data.pymvpa.org/datasets/haxby2001/subj2-2010.01.14.tar.gz ...
[fetch_haxby]
Downloaded 130711552 of 291168628 bytes (44.9%%, 1.2s remaining)
[fetch_haxby]
Downloaded 279093248 of 291168628 bytes (95.9%%, 0.1s remaining)
[fetch_haxby] ...done. (2 seconds, 0 min)
[fetch_haxby] Extracting data from /home/runner/nilearn_data/haxby2001/9cabe068089e791ef0c5fe930fc20e30/subj2-2010.01.14.tar.gz...
[fetch_haxby] .. done.
Now let’s have a look at a generic html template, and focus on the parts that need to be filled in:
1<!DOCTYPE html>
2<html lang="en">
3<body>
4 <!-- This is the div that will host the html brainsprite code -->
5 <div id="div_viewer">
6 <!-- Note the curly brackets are here to tell tempita to update this element. -->
7 {{ html }}
8 </div>
9
10 <!-- Import jquery and brainsprite javascript libraries -->
11 <script src="https://code.jquery.com/jquery-3.5.0.min.js"></script>
12 <script>
13 // We'll inject brainsprite.js here, to make the html self-contained.
14 {{ bsprite }}
15 </script>
16
17 <!-- That's where the js brainsprite code will live -->
18 <script>
19 // On load: build all figures
20 $( window ).on('load',function() {
21 // Create brain slices
22 var brain = brainsprite(
23 // that's where all the brainsprite parameters will be injected.
24 {{ js }}
25 );
26 });
27 </script>
28</body>
29</html>
The parts with {{ }} are part of the tempita language, and means that
we need to populate these parts with three types of brainsprite code: an html
snippet, a javascript snippet, and the brainsprite.js library itself. Let’s use
viewer_substitute to generate the necessary code, and substitute this
code in the template. In terms of the parameters, the defaults are set for a
functional map, and we will need to specify a few arguments to get the right
aspect:
use a gray colormap (
cmap),do not to a symmetric colormap, centered around zero (
symmetric_cmap)pick colors matching a black background (
black_bg)set the maximum value displayed in the image to increase contrast (
vmax)add a title to the viewer (
title)
from brainsprite import viewer_substitute
bsprite = viewer_substitute(
cmap="gray",
symmetric_cmap=False,
black_bg=True,
threshold=None,
vmax=250,
title="anatomical scan",
value=False,
radiological=False,
)
bsprite.fit(haxby_anat_filename)
/home/runner/work/brainsprite/brainsprite/.tox/doc/lib/python3.9/site-packages/brainsprite/brainsprite.py:143: FutureWarning: From release 0.13.0 onwards, this function will, by default, copy the header of the input image to the output. Currently, the header is reset to the default Nifti1Header. To suppress this warning and use the new behavior, set `copy_header=True`.
stat_map_img = resample_to_img(
/home/runner/work/brainsprite/brainsprite/.tox/doc/lib/python3.9/site-packages/brainsprite/brainsprite.py:143: UserWarning: The provided image has no sform in its header. Please check the provided file. Results may not be as expected.
stat_map_img = resample_to_img(
/home/runner/work/brainsprite/brainsprite/.tox/doc/lib/python3.9/site-packages/brainsprite/brainsprite.py:143: UserWarning: Casting data from int32 to float32
stat_map_img = resample_to_img(
/home/runner/work/brainsprite/brainsprite/.tox/doc/lib/python3.9/site-packages/brainsprite/brainsprite.py:149: FutureWarning: From release 0.13.0 onwards, this function will, by default, copy the header of the input image to the output. Currently, the header is reset to the default Nifti1Header. To suppress this warning and use the new behavior, set `copy_header=True`.
mask_img = resample_to_img(
We can now open the template with tempita, and fill it with the required information. The parameters indicate which tempita names we used in the template for the javascript, html and library code, respectively.
from pathlib import Path
import tempita
examples_dir = Path.cwd()
if examples_dir.name != "examples":
examples_dir = examples_dir / "examples"
file_template = examples_dir / "viewer_template.html"
template = tempita.Template.from_filename(file_template, encoding="utf-8")
viewer = bsprite.transform(template, javascript="js", html="html", library="bsprite")
The object viewer can be called directly to insert the viewer inside
a jupyter notebook:
viewer