Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found

Target

Select target project
  • grosch1/jupyter-dashboarding
  • petrova1/jupyter-dashboarding
2 results
Show changes
Commits on Source (7)
Hide whitespace changes
Inline Side-by-side
Showing
with 47 additions and 728 deletions
.gitignore 0 → 100644
View file @ d44c3ae8
.ipynb_checkpoints
.ipynb_checkpoints/voila-basic-checkpoint.ipynb deleted 100644 → 0
View file @ 08f96afe
{
"cells": [],
"metadata": {},
"nbformat": 4,
"nbformat_minor": 2
}
.ipynb_checkpoints/voila-dashboard-checkpoint.ipynb deleted 100644 → 0
View file @ 08f96afe
%% Cell type:markdown id: tags:
This demo uses voila to render a notebook to a custom HTML page using gridstack.js for the layout of each output. In the cell metadata you can change the default cell with and height (in grid units between 1 and 12) by specifying.
* `grid_row`
* `grid_columns`
%% Cell type:code id: tags:
``` python
import numpy as np
n = 200
x = np.linspace(0.0, 10.0, n)
y = np.cumsum(np.random.randn(n)*10).astype(int)
```
%% Cell type:code id: tags:
``` python
import ipywidgets as widgets
```
%% Cell type:code id: tags:
``` python
label_selected = widgets.Label(value="Selected: 0")
label_selected
```
%% Cell type:code id: tags:
``` python
import numpy as np
from bqplot import pyplot as plt
import bqplot
fig = plt.figure( title='Histogram')
np.random.seed(0)
hist = plt.hist(y, bins=25)
hist.scales['sample'].min = float(y.min())
hist.scales['sample'].max = float(y.max())
display(fig)
fig.layout.width = 'auto'
fig.layout.height = 'auto'
fig.layout.min_height = '300px' # so it shows nicely in the notebook
fig.layout.flex = '1'
```
%% Cell type:code id: tags:
``` python
import numpy as np
from bqplot import pyplot as plt
import bqplot
fig = plt.figure( title='Line Chart')
np.random.seed(0)
n = 200
p = plt.plot(x, y)
fig
```
%% Cell type:code id: tags:
``` python
fig.layout.width = 'auto'
fig.layout.height = 'auto'
fig.layout.min_height = '300px' # so it shows nicely in the notebook
fig.layout.flex = '1'
```
%% Cell type:code id: tags:
``` python
brushintsel = bqplot.interacts.BrushIntervalSelector(scale=p.scales['x'])
```
%% Cell type:code id: tags:
``` python
def update_range(*args):
label_selected.value = "Selected range {}".format(brushintsel.selected)
mask = (x > brushintsel.selected[0]) & (x < brushintsel.selected[1])
hist.sample = y[mask]
brushintsel.observe(update_range, 'selected')
fig.interaction = brushintsel
```
.ipynb_checkpoints/voila-ipyvolume-checkpoint.ipynb deleted 100644 → 0
View file @ 08f96afe
%% Cell type:code id: tags:
``` python
import ipyvolume as ipv
ipv.examples.example_ylm();
```
%% Output
%% Cell type:code id: tags:
``` python
```
.ipynb_checkpoints/vuetify-bqplot-checkpoint.ipynb deleted 100644 → 0
View file @ 08f96afe
%% Cell type:code id: tags:
``` python
import ipyvuetify as v
```
%% Cell type:markdown id: tags:
# First histogram plot
%% Cell type:code id: tags:
``` python
import ipywidgets as widgets
import numpy as np
from bqplot import pyplot as plt
import bqplot
n = 200
x = np.linspace(0.0, 10.0, n)
y = np.cumsum(np.random.randn(n)*10).astype(int)
fig = plt.figure( title='Histogram')
np.random.seed(0)
hist = plt.hist(y, bins=25)
hist.scales['sample'].min = float(y.min())
hist.scales['sample'].max = float(y.max())
fig.layout.width = 'auto'
fig.layout.height = 'auto'
fig.layout.min_height = '300px' # so it shows nicely in the notebook
fig
```
%% Cell type:code id: tags:
``` python
slider = v.Slider(thumb_label='always', class_="px-4", v_model=30)
widgets.link((slider, 'v_model'), (hist, 'bins'))
slider
```
%% Cell type:markdown id: tags:
# Line chart
%% Cell type:code id: tags:
``` python
fig2 = plt.figure( title='Line Chart')
np.random.seed(0)
p = plt.plot(x, y)
fig2.layout.width = 'auto'
fig2.layout.height = 'auto'
fig2.layout.min_height = '300px' # so it shows nicely in the notebook
fig2
```
%% Cell type:code id: tags:
``` python
```
%% Cell type:code id: tags:
``` python
brushintsel = bqplot.interacts.BrushIntervalSelector(scale=p.scales['x'])
def update_range(*args):
if brushintsel.selected is not None and brushintsel.selected.shape == (2,):
mask = (x > brushintsel.selected[0]) & (x < brushintsel.selected[1])
hist.sample = y[mask]
brushintsel.observe(update_range, 'selected')
fig2.interaction = brushintsel
```
%% Cell type:markdown id: tags:
# Second histogram plot
%% Cell type:code id: tags:
``` python
n2 = 200
x2 = np.linspace(0.0, 10.0, n)
y2 = np.cumsum(np.random.randn(n)*10).astype(int)
figHist2 = plt.figure( title='Histogram 2')
np.random.seed(0)
hist2 = plt.hist(y2, bins=25)
hist2.scales['sample'].min = float(y2.min())
hist2.scales['sample'].max = float(y2.max())
figHist2.layout.width = 'auto'
figHist2.layout.height = 'auto'
figHist2.layout.min_height = '300px' # so it shows nicely in the notebook
sliderHist2 = v.Slider(_metadata={'mount_id': 'histogram_bins2'}, thumb_label='always', class_='px-4', v_model=5)
from traitlets import link
link((sliderHist2, 'v_model'), (hist2, 'bins'))
display(figHist2)
display(sliderHist2)
```
%% Cell type:markdown id: tags:
# Set up voila vuetify layout
The voila vuetify template does not render output from the notebook, it only shows widget with the mount_id metadata.
%% Cell type:code id: tags:
``` python
v.Tabs(_metadata={'mount_id': 'content-main'}, children=[
v.Tab(children=['Tab1']),
v.Tab(children=['Tab2']),
v.TabItem(children=[
v.Layout(row=True, wrap=True, align_center=True, children=[
v.Flex(xs12=True, lg6=True, xl4=True, children=[
fig, slider
]),
v.Flex(xs12=True, lg6=True, xl4=True, children=[
figHist2, sliderHist2
]),
v.Flex(xs12=True, xl4=True, children=[
fig2
]),
])
]),
v.TabItem(children=[
v.Container(children=['Lorum ipsum'])
])
])
```
%% Cell type:code id: tags:
``` python
```
README.md 0 → 100644
View file @ d44c3ae8
# Jupyter Web Applications
Example web applications using voila and voila-vuetify
## Tutorials
For an in-depth tutorial of `ipywidgets`, please refer to the official [tutorial](https://github.com/jupyter-widgets/tutorial).
A summary can be found under [ipywidgets](./ipywidgets), which contains the bare minimum of information to get you started.
A tutorial for creating your own `ipyvuetify` dashboard can be found [here](./dashboards/vuetify-custom.ipynb).
## Example apps
You can find a collection of example either on the official [voila-gallery website](https://voila-gallery.org/) or in the subdirectory [voila-examples](./voila-examples).
Unless otherwise specified in the notebooks, you can start voila webapp over the command-line using `voila <your-notebook>`. For possible configuration options, use `voila --help`.
If using JupyterLab with `jupyterlab-preview` installed, you can render a preview of your app with the yellow-grey circle button in the notebook toolbar.
![JupyterLab preview](./images/jupyterlab_preview_pfeil.png "jupyterlab-preview button")
## The different ways to use Voila
The following two examples show how a standalone Jupyter notebook can be turned into a separate app, from the command-line integration.
### Rendering a notebook including interactive widgets and rich mime-type rendering
![Voila basics](./images/voila-basics.gif)
### Rendering a notebook making use of a custom widget library ([bqplot](https://github.com/bloomberg/bqplot
![Voila bqplot](./images/voila-bqplot.gif)
### Voilà dashboards with other language kernels
Voilà is built upon Jupyter standard formats and protocols, and is agnostic to the programming language of the notebook. In this example, we present an example of a Voilà application powered by the C++ Jupyter kernel [xeus-cling](https://github.com/QuantStack/xeus-cling), and the [xleaflet](https://github.com/QuantStack/xleaflet) project.
![Voila cling](./images/voila-cling.gif)
### To use the gridstack template, pass option --template=gridstack to the voila command line
![Voila gridstack](./images/voila-gridstack.gif)
### Using the voila-vuetify template with Jupyter widgets based on vuetify UI components which implement Google's Material Design Spec with the Vue.js framework
![Voila vuetify](./images/voila-vuetify.gif)
\ No newline at end of file
docker/Dockerfile deleted 100644 → 0
View file @ 08f96afe
FROM jupyter/minimal-notebook
USER root
RUN mkdir /software
WORKDIR /software
RUN wget 'https://www.paraview.org/files/v5.7/ParaView-5.7.0-osmesa-MPI-Linux-Python3.7-64bit.tar.gz' \
&& tar xf ParaView-5.7.0-osmesa-MPI-Linux-Python3.7-64bit.tar.gz \
&& rm ParaView-5.7.0-osmesa-MPI-Linux-Python3.7-64bit.tar.gz
ENV PATH="/software/ParaView-5.7.0-osmesa-MPI-Linux-Python3.7-64bit/bin:${PATH}"
RUN apt-get update && apt-get -y install openssh-server net-tools \
&& rm -rf /var/lib/apt/lists/*
USER $NB_UID
WORKDIR /home/$NB_USER/work
COPY --chown=1000:100 extensions/vtk-remoterender /home/$NB_USER/.jupyter/vtk-remoterender
RUN pip install service_identity \
voila \
ipyvuetify voila-vuetify \
/home/$NB_USER/.jupyter/vtk-remoterender \
&& jupyter labextension install --no-build \
@jupyter-widgets/jupyterlab-manager \
@jupyter-voila/jupyterlab-preview \
jupyter-vuetify \
/home/$NB_USER/.jupyter/vtk-remoterender/js \
&& jupyter lab build && jupyter lab clean \
&& npm cache clean --force \
&& rm -rf $CONDA_DIR/share/jupyter/lab/staging \
&& rm -rf /home/$NB_USER/.cache/yarn \
&& rm -rf /home/$NB_USER/.node-gyp
docker/extensions/vtk-remoterender/MANIFEST.in deleted 100644 → 0
View file @ 08f96afe
recursive-include vtk_remoterender/static *.*
include vtk-remoterender.json
include js/package.json
\ No newline at end of file
docker/extensions/vtk-remoterender/js/lib/embed.js deleted 100644 → 0
View file @ 08f96afe
// Entry point for the unpkg bundle containing custom model definitions.
//
// It differs from the notebook bundle in that it does not need to define a
// dynamic baseURL for the static assets and may load some css that would
// already be loaded by the notebook otherwise.
// Export widget models and views, and the npm package version number.
module.exports = require('./remoterender.js');
module.exports['version'] = require('../package.json').version;
docker/extensions/vtk-remoterender/js/lib/extension.js deleted 100644 → 0
View file @ 08f96afe
// This file contains the javascript that is run when the notebook is loaded.
// It contains some requirejs configuration and the `load_ipython_extension`
// which is required for any notebook extension.
//
// Some static assets may be required by the custom widget javascript. The base
// url for the notebook is not known at build time and is therefore computed
// dynamically.
__webpack_public_path__ = document.querySelector('body').getAttribute('data-base-url') + 'nbextensions/vtk-remoterender';
// Configure requirejs
if (window.require) {
window.require.config({
map: {
"*" : {
"vtk-remoterender": "nbextensions/vtk-remoterender/index",
}
}
});
}
// Export the required load_ipython_extension
module.exports = {
load_ipython_extension: function() {}
};
docker/extensions/vtk-remoterender/js/lib/index.js deleted 100644 → 0
View file @ 08f96afe
// Export widget models and views, and the npm package version number.
module.exports = require('./remoterender.js');
module.exports['version'] = require('../package.json').version;
docker/extensions/vtk-remoterender/js/lib/labplugin.js deleted 100644 → 0
View file @ 08f96afe
var vtk_remoterender = require('./index');
var base = require('@jupyter-widgets/base');
module.exports = {
id: 'vtk-remoterender',
requires: [base.IJupyterWidgetRegistry],
activate: function(app, widgets) {
widgets.registerWidget({
name: 'vtk-remoterender',
version: vtk_remoterender.version,
exports: vtk_remoterender
});
},
autoStart: true
};
docker/extensions/vtk-remoterender/js/lib/remoterender.js deleted 100644 → 0
View file @ 08f96afe
var widgets = require('@jupyter-widgets/base');
var _ = require('lodash');
import ParaViewWebClient from 'paraviewweb/src/IO/WebSocket/ParaViewWebClient';
import RemoteRenderer from 'paraviewweb/src/NativeUI/Canvas/RemoteRenderer';
import SizeHelper from "paraviewweb/src/Common/Misc/SizeHelper";
import SmartConnect from 'wslink/src/SmartConnect';
var _getId = (function () {
var cnt = 0;
return function () {
cnt += 1;
return 'canvas_' + cnt;
}
})();
export var RemoteRenderModel = widgets.DOMWidgetModel.extend({
defaults: _.extend(widgets.DOMWidgetModel.prototype.defaults(), {
_model_name: 'RemoteRenderModel',
_view_name: 'RemoteRenderView',
_model_module: 'vtk-remoterender',
_view_module: 'vtk-remoterender',
_model_module_version: '0.1.0',
_view_module_version: '0.1.0',
})
});
export var RemoteRenderView = widgets.DOMWidgetView.extend({
render: function () {
var parent_div = this.$el.parent().prevObject[0];
var divRenderer = document.createElement('div');
divRenderer.style.minHeight = '400px';
divRenderer.style.minWidth = '400px';
divRenderer.style.height = '100%';
divRenderer.style.width = '100%';
divRenderer.id = _getId();
this.el.appendChild(divRenderer);
var that = this;
var config = { sessionURL: this.model.get('sessionURL'), secret: this.model.get('authKey') };
console.log(config);
var smartConnect = SmartConnect.newInstance({ config: config });
console.log(smartConnect);
smartConnect.onConnectionReady(function (connection) {
var pvwClient = ParaViewWebClient.createClient(connection, ['MouseHandler', 'ViewPort', 'ViewPortImageDelivery']);
var renderer = new RemoteRenderer(pvwClient);
renderer.setContainer(divRenderer);
renderer.setView(that.model.get('viewID'));
renderer.showStats = true;
renderer.onImageReady(function () {
if (parent_div.style.width != '100%') {
parent_div.style.width = '100%';
renderer.resize();
}
console.log("We are good.");
});
that.model.on('change:_update', function() {
// renderer.render(true);
renderer.render(false);
}, that);
SizeHelper.onSizeChange(function () {
renderer.resize();
});
SizeHelper.startListening();
});
smartConnect.connect();
},
})
docker/extensions/vtk-remoterender/js/package.json deleted 100644 → 0
View file @ 08f96afe
{
"name": "vtk-remoterender",
"version": "0.1.0",
"description": "Interactive rendering via a vtk remote renderer",
"author": "Alice Grosch",
"main": "lib/index.js",
"repository": {
"type": "git",
"url": "https://github.com//vtk-remoterender.git"
},
"keywords": [
"jupyter",
"widgets",
"ipython",
"ipywidgets",
"jupyterlab-extension"
],
"files": [
"lib/**/*.js",
"dist/*.js"
],
"scripts": {
"clean": "rimraf dist/",
"prepublish": "webpack",
"test": "echo \"Error: no test specified\" && exit 1"
},
"devDependencies": {
"webpack": "^3.5.5",
"rimraf": "^2.6.1"
},
"dependencies": {
"@jupyter-widgets/base": "^2",
"lodash": "^4.17.4",
"hammerjs": "^2.0.8",
"monologue.js": "^0.3.5",
"paraviewweb": "3.2.2",
"wslink": "^0.1.11"
},
"jupyterlab": {
"extension": "lib/labplugin"
}
}
docker/extensions/vtk-remoterender/js/webpack.config.js deleted 100644 → 0
View file @ 08f96afe
var path = require('path');
var version = require('./package.json').version;
// Custom webpack rules are generally the same for all webpack bundles, hence
// stored in a separate local variable.
var rules = [
{ test: /\.css$/, use: ['style-loader', 'css-loader']}
]
module.exports = [
{// Notebook extension
//
// This bundle only contains the part of the JavaScript that is run on
// load of the notebook. This section generally only performs
// some configuration for requirejs, and provides the legacy
// "load_ipython_extension" function which is required for any notebook
// extension.
//
entry: './lib/extension.js',
output: {
filename: 'extension.js',
path: path.resolve(__dirname, '..', 'vtk_remoterender', 'static'),
libraryTarget: 'amd'
}
},
{// Bundle for the notebook containing the custom widget views and models
//
// This bundle contains the implementation for the custom widget views and
// custom widget.
// It must be an amd module
//
entry: './lib/index.js',
output: {
filename: 'index.js',
path: path.resolve(__dirname, '..', 'vtk_remoterender', 'static'),
libraryTarget: 'amd'
},
devtool: 'source-map',
module: {
rules: rules
},
externals: ['@jupyter-widgets/base']
},
{// Embeddable vtk-remoterender bundle
//
// This bundle is generally almost identical to the notebook bundle
// containing the custom widget views and models.
//
// The only difference is in the configuration of the webpack public path
// for the static assets.
//
// It will be automatically distributed by unpkg to work with the static
// widget embedder.
//
// The target bundle is always `dist/index.js`, which is the path required
// by the custom widget embedder.
//
entry: './lib/embed.js',
output: {
filename: 'index.js',
path: path.resolve(__dirname, 'dist'),
libraryTarget: 'amd',
publicPath: 'https://unpkg.com/vtk-remoterender@' + version + '/dist/'
},
devtool: 'source-map',
module: {
rules: rules
},
externals: ['@jupyter-widgets/base']
}
];
docker/extensions/vtk-remoterender/setup.cfg deleted 100644 → 0
View file @ 08f96afe
[bdist_wheel]
universal=1
docker/extensions/vtk-remoterender/setup.py deleted 100644 → 0
View file @ 08f96afe
from __future__ import print_function
from setuptools import setup, find_packages, Command
from setuptools.command.sdist import sdist
from setuptools.command.build_py import build_py
from setuptools.command.egg_info import egg_info
from subprocess import check_call
import os
import sys
import platform
here = os.path.dirname(os.path.abspath(__file__))
node_root = os.path.join(here, 'js')
is_repo = os.path.exists(os.path.join(here, '.git'))
npm_path = os.pathsep.join([
os.path.join(node_root, 'node_modules', '.bin'),
os.environ.get('PATH', os.defpath),
])
from distutils import log
log.set_verbosity(log.DEBUG)
log.info('setup.py entered')
log.info('$PATH=%s' % os.environ['PATH'])
LONG_DESCRIPTION = 'Interactive rendering via a vtk remote renderer'
def js_prerelease(command, strict=False):
"""decorator for building minified js/css prior to another command"""
class DecoratedCommand(command):
def run(self):
jsdeps = self.distribution.get_command_obj('jsdeps')
if not is_repo and all(os.path.exists(t) for t in jsdeps.targets):
# sdist, nothing to do
command.run(self)
return
try:
self.distribution.run_command('jsdeps')
except Exception as e:
missing = [t for t in jsdeps.targets if not os.path.exists(t)]
if strict or missing:
log.warn('rebuilding js and css failed')
if missing:
log.error('missing files: %s' % missing)
raise e
else:
log.warn('rebuilding js and css failed (not a problem)')
log.warn(str(e))
command.run(self)
update_package_data(self.distribution)
return DecoratedCommand
def update_package_data(distribution):
"""update package_data to catch changes during setup"""
build_py = distribution.get_command_obj('build_py')
# distribution.package_data = find_package_data()
# re-init build_py options which load package_data
build_py.finalize_options()
class NPM(Command):
description = 'install package.json dependencies using npm'
user_options = []
node_modules = os.path.join(node_root, 'node_modules')
targets = [
os.path.join(here, 'vtk_remoterender', 'static', 'extension.js'),
os.path.join(here, 'vtk_remoterender', 'static', 'index.js')
]
def initialize_options(self):
pass
def finalize_options(self):
pass
def get_npm_name(self):
npmName = 'npm';
if platform.system() == 'Windows':
npmName = 'npm.cmd';
return npmName;
def has_npm(self):
npmName = self.get_npm_name();
try:
check_call([npmName, '--version'])
return True
except:
return False
def should_run_npm_install(self):
package_json = os.path.join(node_root, 'package.json')
node_modules_exists = os.path.exists(self.node_modules)
return self.has_npm()
def run(self):
has_npm = self.has_npm()
if not has_npm:
log.error("`npm` unavailable. If you're running this command using sudo, make sure `npm` is available to sudo")
env = os.environ.copy()
env['PATH'] = npm_path
if self.should_run_npm_install():
log.info("Installing build dependencies with npm. This may take a while...")
npmName = self.get_npm_name();
check_call([npmName, 'install'], cwd=node_root, stdout=sys.stdout, stderr=sys.stderr)
os.utime(self.node_modules, None)
for t in self.targets:
if not os.path.exists(t):
msg = 'Missing file: %s' % t
if not has_npm:
msg += '\nnpm is required to build a development version of a widget extension'
raise ValueError(msg)
# update package data in case this created new files
update_package_data(self.distribution)
version_ns = {}
with open(os.path.join(here, 'vtk_remoterender', '_version.py')) as f:
exec(f.read(), {}, version_ns)
setup_args = {
'name': 'vtk_remoterender',
'version': version_ns['__version__'],
'description': 'Interactive rendering via a vtk remote renderer',
'long_description': LONG_DESCRIPTION,
'include_package_data': True,
'package_data': {'vtk_remoterender':['js/*']},
'data_files': [
('share/jupyter/nbextensions/vtk-remoterender', [
'vtk_remoterender/static/extension.js',
'vtk_remoterender/static/index.js',
'vtk_remoterender/static/index.js.map',
],),
('etc/jupyter/nbconfig/notebook.d' ,['vtk-remoterender.json'])
],
'install_requires': [
'ipywidgets>=7.0.0',
'wslink>=0.1.11',
],
'packages': find_packages(),
'zip_safe': False,
'cmdclass': {
'build_py': js_prerelease(build_py),
'egg_info': js_prerelease(egg_info),
'sdist': js_prerelease(sdist, strict=True),
'jsdeps': NPM,
},
'author': 'Alice Grosch',
'author_email': 'a.grosch@fz-juelich.de',
'url': 'https://github.com//vtk-remoterender',
'keywords': [
'ipython',
'jupyter',
'widgets',
],
'classifiers': [
'Development Status :: 4 - Beta',
'Framework :: IPython',
'Intended Audience :: Developers',
'Intended Audience :: Science/Research',
'Topic :: Multimedia :: Graphics',
'Programming Language :: Python :: 2',
'Programming Language :: Python :: 2.7',
'Programming Language :: Python :: 3',
'Programming Language :: Python :: 3.3',
'Programming Language :: Python :: 3.4',
'Programming Language :: Python :: 3.5',
],
}
setup(**setup_args)
docker/extensions/vtk-remoterender/vtk-remoterender.json deleted 100644 → 0
View file @ 08f96afe
{
"load_extensions": {
"vtk-remoterender/extension": true
}
}
docker/extensions/vtk-remoterender/vtk_remoterender/__init__.py deleted 100644 → 0
View file @ 08f96afe
from ._version import version_info, __version__
from .remoterender import *
def _jupyter_nbextension_paths():
return [{
'section': 'notebook',
'src': 'static',
'dest': 'vtk-remoterender',
'require': 'vtk-remoterender/extension'
}]
docker/extensions/vtk-remoterender/vtk_remoterender/_version.py deleted 100644 → 0
View file @ 08f96afe
version_info = (0, 1, 0, 'alpha', 0)
_specifier_ = {'alpha': 'a', 'beta': 'b', 'candidate': 'rc', 'final': ''}
__version__ = '%s.%s.%s%s'%(version_info[0], version_info[1], version_info[2],
'' if version_info[3]=='final' else _specifier_[version_info[3]]+str(version_info[4]))