# Run Slicer in your web browser - as a Jupyter notebook or as a full application

**URL:** <https://discourse.slicer.org/t/run-slicer-in-your-web-browser-as-a-jupyter-notebook-or-as-a-full-application/11569>\
**Category:** Announcements\
**Tags:** feature, jupyter, web\
**Created:** [May 16, 2020, 1:51am UTC](https://discourse.slicer.org/t/run-slicer-in-your-web-browser-as-a-jupyter-notebook-or-as-a-full-application/11569 "2020-05-16T01:51:52Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![lassoan](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.slicer.org/lassoan/32/13_2.png) [@lassoan](https://discourse.slicer.org/u/lassoan)\
**Post date:** [May 16, 2020, 1:51am UTC](https://discourse.slicer.org/t/run-slicer-in-your-web-browser-as-a-jupyter-notebook-or-as-a-full-application/11569/1 "2020-05-16T01:51:52Z")

</div>

It has been possible to use Slicer from Jupyter notebooks but the most recent Slicer Preview Release takes this to a whole new level.

**[Click here to try a few example interactive notebooks now](https://mybinder.org/v2/gh/slicer/SlicerNotebooks/master)** - or see a short video demonstrating the new features:

[![](https://img.youtube.com/vi/oZ3_cRXX2QM/maxresdefault.jpg "Medical image processing in your web browser using Jupyter notebooks and 3D Slicer") ](https://www.youtube.com/watch?v=oZ3_cRXX2QM)

Highlights:

1. Improved interactive use

You can now use IPython widgets (sliders, buttons, etc.) to control Slicer or adjust processing and visualization parameters. For example, CLI module parameters can be adjusted using slider widgets and results are computed and displayed autoamtically in the notebook:

 ![image](https://us1.discourse-cdn.com/flex002/uploads/slicer/original/3X/5/a/5afc2fa862bc323a736372a591eac1040f9d046d.jpeg)

3D Slicer views are in notebooks are now interactive. You can zoom/rotate 3D views, browse slices, place points, or edit segmentations - right in the notebook:

 ![image](https://us1.discourse-cdn.com/flex002/uploads/slicer/original/3X/8/9/890d6996000371ed8f1c5904cc51f194eba0679e.jpeg)

You can display and control selected viewers, all viewers, or the entire application in notebook cells. This allows users to implement complete data processing workflows in a notebook, even if certain steps require manual user inputs (3D regions, seed points, etc.).

1. Data node visualization directly in the notebook

Slicer takes advantage of rich data visualization capabilities of Jupyter notebooks. For example, markup fiducial list node is displayed as a nicely formatted table, model node is rendered as a 3D object, etc. New visualizers can be added for all MRML node types, if this proves to be useful.

 ![image](https://us1.discourse-cdn.com/flex002/uploads/slicer/original/3X/1/4/144fc08e8f6c98983a639b314a1de43dbbc22fa1.png)

1. Available on the web

Since now the full application user interface is available interactively in Jupyter, it is possible to use Slicer remotely, in a web browser, without installing any software locally. For example, **[click here to launch Slicer in your web browser using _binder_](https://mybinder.org/v2/gh/slicer/SlicerNotebooks/master?filepath=SlicerWeb.ipynb)** - a free Jupyter web hosting service. They allocate quite limited computational resources to each instance, but it still sufficient to run Slicer.

[

 ![image](https://us1.discourse-cdn.com/flex002/uploads/slicer/original/3X/4/5/45f43a9f0fa6435553d6c36d642574ebe80f181d.jpeg)

* * *

Many thanks to Jupyter/xeus team, and especially to Sylvain Corlay and Martin Renou for their excellent work of creating a robust and flexible Jupyter kernel for C++ applications with embedded Python; and to @jcfr for setting up the new Slicer docker container.

More information, instructions for local installation: [GitHub - Slicer/SlicerJupyter: Extension for 3D Slicer that allows the application to be used from Jupyter notebook](https://github.com/Slicer/SlicerJupyter)

Any comments and suggestions are welcome.

---

<div class="post-metadata">

**Author:** ![muratmaga](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.slicer.org/muratmaga/32/3622_2.png) [@muratmaga](https://discourse.slicer.org/u/muratmaga)\
**Post date:** [May 16, 2020, 4:13pm UTC](https://discourse.slicer.org/t/run-slicer-in-your-web-browser-as-a-jupyter-notebook-or-as-a-full-application/11569/2 "2020-05-16T16:13:27Z")

</div>

@lassoan this is great. COngrats to everyone who helped to develop.

I don’t know much about binder, would the backend benefit from GPU and GPU accelerated rendering for large volumes (that typically our users work with)?

---

<div class="post-metadata">

**Author:** ![lassoan](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.slicer.org/lassoan/32/13_2.png) [@lassoan](https://discourse.slicer.org/u/lassoan)\
**Post date:** [May 16, 2020, 6:55pm UTC](https://discourse.slicer.org/t/run-slicer-in-your-web-browser-as-a-jupyter-notebook-or-as-a-full-application/11569/3 "2020-05-16T18:55:37Z")

</div>

Yes, you can configure your docker container to use GPU.

---

<div class="post-metadata">

**Author:** ![samsonaie](https://avatars.discourse-cdn.com/v4/letter/s/d07c76/32.png) [@samsonaie](https://discourse.slicer.org/u/samsonaie)\
**Post date:** [May 22, 2020, 8:46am UTC](https://discourse.slicer.org/t/run-slicer-in-your-web-browser-as-a-jupyter-notebook-or-as-a-full-application/11569/4 "2020-05-22T08:46:09Z")

</div>

great to know !!! Thanks a lot for the efforts!

---

<div class="post-metadata">

**Author:** ![Fernando](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.slicer.org/fernando/32/5640_2.png) [@Fernando](https://discourse.slicer.org/u/Fernando)\
**Post date:** [November 20, 2020, 7:01pm UTC](https://discourse.slicer.org/t/run-slicer-in-your-web-browser-as-a-jupyter-notebook-or-as-a-full-application/11569/5 "2020-11-20T19:01:33Z")

</div>

I want to 1) emphasize how cool this is and 2) ask: is there a way to open Slicer in a new tab using the whole extent of the screen? I have forked the repo to give access to users to a demo of our module:  
[![Binder](https://mybinder.org/badge_logo.svg)](https://mybinder.org/v2/gh/fepegar/SlicerNotebooks/9577bab?filepath=SVT-web.ipynb)

At the moment, it looks like this:

 ![Screen Shot 2020-11-20 at 18.56.05](https://us1.discourse-cdn.com/flex002/uploads/slicer/original/3X/f/5/f56cf39c9de1248a983726e854bcc06042043923.jpeg)

As you can see, a lot of space is wasted around each side of the window.

I tried `slicer.util.mainWindow().setFixedWidth(width)` but the window just went “behind” the gray margins.

---

<div class="post-metadata">

**Author:** ![lassoan](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.slicer.org/lassoan/32/13_2.png) [@lassoan](https://discourse.slicer.org/u/lassoan)\
**Post date:** [November 20, 2020, 7:18pm UTC](https://discourse.slicer.org/t/run-slicer-in-your-web-browser-as-a-jupyter-notebook-or-as-a-full-application/11569/6 "2020-11-20T19:18:05Z")

</div>

It is great that you like it! (it is not obvious that it just how powerful this infrastructure is)

You can open a new browser tab automatically like this:

```
display(Javascript('window.open("../desktop", "_blank");'))

```

You have a couple of options for controlling window size, resolution, and scaling. One option is to display noVNC manual controls (we decided to remove it for sake of simplicity). The other is to configure noVNC and the window manager to automatically resize (it is not so trivial, because you may not want to have very high resolution because rendering may slow down, so above a certain size you would rather scale; and you probably also want to support certain range of screen aspect ratio). noVNC is used very widely and all kinds of automatic resizing/rescaling solutions are already available if you search on the web.

---

<div class="post-metadata">

**Author:** ![Fernando](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.slicer.org/fernando/32/5640_2.png) [@Fernando](https://discourse.slicer.org/u/Fernando)\
**Post date:** [November 20, 2020, 7:23pm UTC](https://discourse.slicer.org/t/run-slicer-in-your-web-browser-as-a-jupyter-notebook-or-as-a-full-application/11569/7 "2020-11-20T19:23:59Z")

</div>

I see. That’s slightly different to the line I’m using to open the tab automatically:

> <https://github.com/fepegar/SlicerNotebooks/blob/9577babf550bc965cb619c1b707ac4d1d44ca8fb/SVT-web.ipynb#L53>

But I see in the [JavaScript docs](https://www.w3schools.com/jsref/met_win_open.asp) (are they?) that `"_blank"` is the default anyway. In the binder I shared above, with a single cell and a line at the end that opens the new tab, my Chrome blocked the new tab and asked if I wanted to allow pop-ups. But that’s not very important.

I’ll look into noVNC to improve the window size issues. Thanks, @lassoan!

---

<div class="post-metadata">

**Author:** ![Jan\_Alexander](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.slicer.org/jan_alexander/32/6831_2.png) [@Jan\_Alexander](https://discourse.slicer.org/u/Jan_Alexander)\
**Post date:** [February 17, 2021, 8:59pm UTC](https://discourse.slicer.org/t/run-slicer-in-your-web-browser-as-a-jupyter-notebook-or-as-a-full-application/11569/8 "2021-02-17T20:59:46Z")

</div>

This is great!

Is there some kind of documentation page I can find somewhere?

---

<div class="post-metadata">

**Author:** ![Zakragnos](https://avatars.discourse-cdn.com/v4/letter/z/c37758/32.png) [@Zakragnos](https://discourse.slicer.org/u/Zakragnos)\
**Post date:** [December 8, 2021, 1:30pm UTC](https://discourse.slicer.org/t/run-slicer-in-your-web-browser-as-a-jupyter-notebook-or-as-a-full-application/11569/9 "2021-12-08T13:30:55Z")

</div>

Is there a way to make use of a part of slicer’s function in a program? I’m trying to use my own method of segmentation and I want to use slicer’s 3d model generation/volume creation from a segmented arrays of image, to then export it as an stl file. Is there a way I could achieve this?

---

<div class="post-metadata">

**Author:** ![pll\_llq](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.slicer.org/pll_llq/32/9408_2.png) [@pll\_llq](https://discourse.slicer.org/u/pll_llq)\
**Post date:** [December 9, 2021, 6:16am UTC](https://discourse.slicer.org/t/run-slicer-in-your-web-browser-as-a-jupyter-notebook-or-as-a-full-application/11569/10 "2021-12-09T06:16:22Z")

</div>

You can use the Slicer application headless to run scripts in the Slicer environment. This can run natively alongside your app or from a docker container (for example if you wish to make it a part of a web app.  
In addition to this there is a web server for slicer in the works. This will allow you to get access to functionality of Slicer using web requests.

Although if your segmentation method is python based and you are working with a desktop app I would suggest you consider using Slicer as a host platform and integrate the segmentation into it.

---

<div class="post-metadata">

**Author:** ![mau\_igna\_06](https://sea2.discourse-cdn.com/flex002/user_avatar/discourse.slicer.org/mau_igna_06/32/9056_2.png) [@mau\_igna\_06](https://discourse.slicer.org/u/mau_igna_06)\
**Post date:** [December 9, 2021, 10:20am UTC](https://discourse.slicer.org/t/run-slicer-in-your-web-browser-as-a-jupyter-notebook-or-as-a-full-application/11569/11 "2021-12-09T10:20:24Z")

</div>

> Is there a way to make use of a part of slicer’s function in a program? I’m trying to use my own method of segmentation and I want to use slicer’s 3d model generation/volume creation from a segmented arrays of image, to then export it as an stl file. Is there a way I could achieve this?

Maybe you can create a python script for Slicer to execute on the console like this:  
`Slicer.exe --python-script "/full/path/to/myscript.py" --no-splash --no-main-window`

Inside the script you need to read your segment data (e.g. from a numpy array, maybe like [this](https://discourse.slicer.org/t/increased-loading-time-for-multiple-segments-from-numpy-array/11026)), then you need to create a closed surface representation of the segment ([like this](https://slicer.readthedocs.io/en/latest/developer_guide/script_repository.html#create-a-segmentation-from-a-labelmap-volume-and-display-in-3d)), you need change the storage of 3D models to stl ([like this](https://slicer.readthedocs.io/en/latest/developer_guide/script_repository.html#change-default-output-file-type-for-new-nodes)), then you need to export segments as models (like [this](https://slicer.readthedocs.io/en/latest/developer_guide/script_repository.html#export-model-nodes-from-segmentation-node)), then you can save your model as .stl maybe like this:  
`slicer.util.saveNode(modelNode, filepath)`

I haven’t tested this workflow, but I think it should work