Skip to content

Commit 32e6434

Browse files
COLLONVAL Fredericfcollonval
COLLONVAL Frederic
authored and
fcollonval
committed
Add anchor attribute to choose between right sidebar or main area
1 parent 9143848 commit 32e6434

File tree

4 files changed

+146
-8
lines changed

4 files changed

+146
-8
lines changed

‎examples/introduction.ipynb

Lines changed: 127 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,56 @@
2323
"metadata": {},
2424
"outputs": [],
2525
"source": [
26-
"sc = Sidecar(title='Sidecar Output')\n",
26+
"from bokeh.io import push_notebook, show, output_notebook\n",
27+
"from bokeh.resources import INLINE\n",
28+
"from bokeh.layouts import row\n",
29+
"from bokeh.plotting import figure\n",
30+
"output_notebook(resources=INLINE)\n",
31+
"opts = dict(plot_width=250, plot_height=250, min_border=0)"
32+
]
33+
},
34+
{
35+
"cell_type": "code",
36+
"execution_count": null,
37+
"metadata": {},
38+
"outputs": [],
39+
"source": [
40+
"p1 = figure(**opts)\n",
41+
"r1 = p1.circle([1,2,3], [4,5,6], size=20)\n",
42+
"\n",
43+
"p2 = figure(**opts)\n",
44+
"r2 = p2.circle([1,2,3], [4,5,6], size=20)"
45+
]
46+
},
47+
{
48+
"cell_type": "code",
49+
"execution_count": null,
50+
"metadata": {},
51+
"outputs": [],
52+
"source": [
53+
"sr = Sidecar(title='Main Sidecar')\n",
54+
"with sr:\n",
55+
" # get a handle to update the shown cell with\n",
56+
" t = show(row(p1, p2), notebook_handle=True)"
57+
]
58+
},
59+
{
60+
"cell_type": "code",
61+
"execution_count": null,
62+
"metadata": {},
63+
"outputs": [],
64+
"source": [
65+
"r1.glyph.fill_color = \"white\"\n",
66+
"push_notebook(handle=t)"
67+
]
68+
},
69+
{
70+
"cell_type": "code",
71+
"execution_count": null,
72+
"metadata": {},
73+
"outputs": [],
74+
"source": [
75+
"sc = Sidecar(title='Right Sidecar', anchor='right')\n",
2776
"sl = IntSlider(description='Some slider')\n",
2877
"with sc:\n",
2978
" display(sl)"
@@ -34,12 +83,86 @@
3483
"execution_count": null,
3584
"metadata": {},
3685
"outputs": [],
37-
"source": []
86+
"source": [
87+
"import plotly\n",
88+
"import plotly.graph_objs as go\n",
89+
"import plotly.tools as tls\n",
90+
"from IPython.display import display\n",
91+
"\n",
92+
"import pandas as pd\n",
93+
"# dataset = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/diabetes.csv')\n",
94+
"dataset = pd.read_csv('diabetes.csv')\n",
95+
"\n",
96+
"subplot = tls.make_subplots(2, 2, print_grid=False)\n",
97+
"f2 = go.FigureWidget(subplot)\n",
98+
"\n",
99+
"sl = Sidecar(title='Main Sidecar')\n",
100+
"with sl:\n",
101+
" display(f2)"
102+
]
103+
},
104+
{
105+
"cell_type": "code",
106+
"execution_count": null,
107+
"metadata": {},
108+
"outputs": [],
109+
"source": [
110+
"# Use add_trace method with optional row/col parameters\n",
111+
"f2.add_trace(go.Scatter(x=dataset['Age'], y=dataset['Pregnancies'], mode='markers'), row=1, col=1)\n",
112+
"\n",
113+
"# Use add_traces with optional rows/cols parameters\n",
114+
"f2.add_traces([\n",
115+
" go.Scatter(x=dataset['Age'], y=dataset['BMI'], mode='markers'),\n",
116+
" go.Scatter(x=dataset['Age'], y=dataset['SkinThickness'], mode='markers')],\n",
117+
" rows=[1, 2], cols=[2, 1]\n",
118+
")\n",
119+
"\n",
120+
"# Use add_scatter with optional row/col parameters\n",
121+
"f2.add_scatter(x=dataset['Age'], y=dataset['BloodPressure'], mode='markers', row=2, col=2)\n",
122+
"\n",
123+
"f2.layout.title = 'Age and Diabetes Factors'"
124+
]
125+
},
126+
{
127+
"cell_type": "code",
128+
"execution_count": null,
129+
"metadata": {},
130+
"outputs": [],
131+
"source": [
132+
"import numpy as np\n",
133+
"data = [dict(\n",
134+
" visible = False,\n",
135+
" line=dict(color='#00CED1', width=6),\n",
136+
" name = '𝜈 = '+str(step),\n",
137+
" x = np.arange(0,10,0.01),\n",
138+
" y = np.sin(step*np.arange(0,10,0.01))) for step in np.arange(0,5,0.1)]\n",
139+
"data[10]['visible'] = True\n",
140+
"\n",
141+
"steps = []\n",
142+
"for i in range(len(data)):\n",
143+
" step = dict(\n",
144+
" method = 'restyle', \n",
145+
" args = ['visible', [False] * len(data)],\n",
146+
" )\n",
147+
" step['args'][1][i] = True # Toggle i'th trace to \"visible\"\n",
148+
" steps.append(step)\n",
149+
"\n",
150+
"sliders = [dict(\n",
151+
" active = 10,\n",
152+
" currentvalue = {\"prefix\": \"Frequency: \"},\n",
153+
" pad = {\"t\": 50},\n",
154+
" steps = steps\n",
155+
")]\n",
156+
"\n",
157+
"layout = dict(sliders=sliders)\n",
158+
"\n",
159+
"go.FigureWidget(data, layout)"
160+
]
38161
}
39162
],
40163
"metadata": {
41164
"kernelspec": {
42-
"display_name": "Python 3",
165+
"display_name": "Python [default]",
43166
"language": "python",
44167
"name": "python3"
45168
},
@@ -53,7 +176,7 @@
53176
"name": "python",
54177
"nbconvert_exporter": "python",
55178
"pygments_lexer": "ipython3",
56-
"version": "3.6.4"
179+
"version": "3.6.5"
57180
}
58181
},
59182
"nbformat": 4,

‎sidecar/sidecar.py

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
"""
1010

1111
from ipywidgets import Output
12-
from traitlets import Unicode
12+
from traitlets import Unicode, CaselessStrEnum
1313
from ._version import EXTENSION_SPEC_VERSION
1414

1515
module_name = "@jupyter-widgets/jupyterlab-sidecar"
@@ -23,3 +23,4 @@ class Sidecar(Output):
2323
_view_module = Unicode(module_name).tag(sync=True)
2424
_view_module_version = Unicode(EXTENSION_SPEC_VERSION).tag(sync=True)
2525
title = Unicode('Sidecar').tag(sync=True)
26+
anchor = CaselessStrEnum(['main', 'right'], allow_none=False).tag(sync=True)

‎src/plugin.ts

Lines changed: 15 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -54,6 +54,10 @@ function activateWidgetExtension(app: JupyterLab, registry: IJupyterWidgetRegist
5454
w.addClass('jp-LinkedOutputView');
5555
w.title.label = this.model.get('title');
5656
w.title.closable = true;
57+
// TODO how to make a left tab closable
58+
// app.shell['_leftHandler'].sideBar.tabCloseRequested.connect((sender : any, tab : any) => {
59+
// tab.title.owner.dispose();
60+
// });
5761
app.shell['_rightHandler'].sideBar.tabCloseRequested.connect((sender : any, tab : any) => {
5862
tab.title.owner.dispose();
5963
});
@@ -65,8 +69,17 @@ function activateWidgetExtension(app: JupyterLab, registry: IJupyterWidgetRegist
6569
v._outputView.activate();
6670
});
6771
} else {
68-
app.shell.add(w, 'right');
69-
app.shell.expandRight();
72+
let anchor = this.model.get('anchor');
73+
if(anchor === 'right'){
74+
app.shell.add(w, 'right');
75+
app.shell.expandRight();
76+
// } else if(anchor === 'left') {
77+
// app.shell.add(w, 'left');
78+
// app.shell.expandLeft();
79+
} else {
80+
app.shell.addToMainArea(w);
81+
w.activate()
82+
}
7083
}
7184
}
7285
}

‎src/widget.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,8 @@ class SidecarModel extends OutputModel {
2323
_view_name: SidecarModel.view_name,
2424
_view_module: SidecarModel.view_module,
2525
_view_module_version: SidecarModel.view_module_version,
26-
title: 'Sidecar'
26+
title: 'Sidecar',
27+
anchor: 'main'
2728
};
2829
}
2930

0 commit comments

Comments
 (0)