Skip to content

Commit 85d634f

Browse files
committed
WIP
1 parent b5fae09 commit 85d634f

File tree

3 files changed

+247
-5
lines changed

3 files changed

+247
-5
lines changed
Lines changed: 241 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,241 @@
1+
{
2+
"cells": [
3+
{
4+
"cell_type": "markdown",
5+
"metadata": {
6+
"nbsphinx": "hidden"
7+
},
8+
"source": [
9+
"# Vitessce Widget Tutorial"
10+
]
11+
},
12+
{
13+
"cell_type": "markdown",
14+
"metadata": {},
15+
"source": [
16+
"# Example usage of Neuroglancer view"
17+
]
18+
},
19+
{
20+
"cell_type": "code",
21+
"execution_count": null,
22+
"metadata": {},
23+
"outputs": [],
24+
"source": [
25+
"from vitessce import (\n",
26+
" VitessceConfig,\n",
27+
" Component as cm,\n",
28+
" CoordinationType as ct,\n",
29+
" ImageOmeTiffWrapper,\n",
30+
" CsvWrapper,\n",
31+
" hconcat,\n",
32+
" vconcat,\n",
33+
" get_initial_coordination_scope_prefix,\n",
34+
" CoordinationLevel as CL\n",
35+
")\n",
36+
"from os.path import join"
37+
]
38+
},
39+
{
40+
"cell_type": "markdown",
41+
"metadata": {},
42+
"source": [
43+
"## 1. Configure Vitessce"
44+
]
45+
},
46+
{
47+
"cell_type": "code",
48+
"execution_count": null,
49+
"metadata": {},
50+
"outputs": [],
51+
"source": [
52+
"vc = VitessceConfig(schema_version=\"1.0.17\")\n",
53+
"dataset = vc.add_dataset(name='Meshes').add_object(\n",
54+
" ImageOmeTiffWrapper(\n",
55+
" img_url='https://lsp-public-data.s3.amazonaws.com/yapp-2023-3d-melanoma/Dataset1-LSP13626-invasive-margin.ome.tiff',\n",
56+
" offsets_url='https://lsp-public-data.s3.amazonaws.com/yapp-2023-3d-melanoma/Dataset1-LSP13626-invasive-margin.offsets.json',\n",
57+
" coordination_values={\n",
58+
" \"fileUid\": 'melanoma',\n",
59+
" },\n",
60+
" )\n",
61+
").add_object(\n",
62+
" CsvWrapper(\n",
63+
" data_type=\"obsEmbedding\",\n",
64+
" csv_url='https://storage.googleapis.com/vitessce-demo-data/neuroglancer-march-2025/melanoma_with_embedding_filtered_ids.csv',\n",
65+
" options= {\n",
66+
" \"obsIndex\": 'id',\n",
67+
" \"obsEmbedding\": ['tSNE1', 'tSNE2'],\n",
68+
" },\n",
69+
" coordination_values= {\n",
70+
" \"obsType\": 'cell',\n",
71+
" \"embeddingType\": 'TSNE',\n",
72+
" },\n",
73+
" )\n",
74+
").add_object(\n",
75+
" CsvWrapper(\n",
76+
" data_type=\"obsSets\",\n",
77+
" csv_url='https://storage.googleapis.com/vitessce-demo-data/neuroglancer-march-2025/melanoma_with_embedding_filtered_ids.csv',\n",
78+
" coordination_values={\n",
79+
" \"obsType\": 'cell',\n",
80+
" },\n",
81+
" options= {\n",
82+
" \"obsIndex\": 'id',\n",
83+
" \"obsSets\": [\n",
84+
" {\n",
85+
" \"name\": 'Clusters',\n",
86+
" \"column\": 'cluster',\n",
87+
" },\n",
88+
" ],\n",
89+
" },\n",
90+
" )\n",
91+
")\n",
92+
"spatialThreeView = vc.add_view('spatialBeta', dataset=dataset);\n",
93+
"lcView = vc.add_view('layerControllerBeta', dataset=dataset);\n",
94+
"obsSets = vc.add_view('obsSets', dataset=dataset);\n",
95+
"scatterView = vc.add_view('scatterplot', dataset=dataset, mapping=\"TSNE\");\n",
96+
"# Configuration via props.viewerState is temporary and subject to change.\n",
97+
"neuroglancerView = vc.add_view('neuroglancer', dataset=dataset).set_props(viewerState={\n",
98+
" \"dimensions\": {\n",
99+
" \"x\": [\n",
100+
" 1e-9,\n",
101+
" \"m\"\n",
102+
" ],\n",
103+
" \"y\": [\n",
104+
" 1e-9,\n",
105+
" \"m\"\n",
106+
" ],\n",
107+
" \"z\": [\n",
108+
" 1e-9,\n",
109+
" \"m\"\n",
110+
" ]\n",
111+
" },\n",
112+
" \"position\": [\n",
113+
" 49.5,\n",
114+
" 1000.5,\n",
115+
" 5209.5\n",
116+
" ],\n",
117+
" \"crossSectionScale\": 1,\n",
118+
" \"projectionOrientation\": [\n",
119+
" -0.636204183101654,\n",
120+
" -0.5028395652770996,\n",
121+
" 0.5443811416625977,\n",
122+
" 0.2145828753709793\n",
123+
" ],\n",
124+
" \"projectionScale\": 1024,\n",
125+
" \"layers\": [\n",
126+
" {\n",
127+
" \"type\": \"segmentation\",\n",
128+
" \"source\": \"precomputed://https://vitessce-data-v2.s3.us-east-1.amazonaws.com/data/sorger/invasive_meshes\",\n",
129+
" \"segments\": [\n",
130+
" \"5\"\n",
131+
" ],\n",
132+
" \"segmentColors\": {\n",
133+
" \"5\": \"red\"\n",
134+
" },\n",
135+
" \"name\": \"segmentation\"\n",
136+
" }\n",
137+
" ],\n",
138+
" \"showSlices\": False,\n",
139+
" \"layout\": \"3d\"\n",
140+
"});\n",
141+
"\n",
142+
"vc.link_views([scatterView], ['embeddingObsRadiusMode', 'embeddingObsRadius'], ['manual', 4]);\n",
143+
"\n",
144+
"# Sync the zoom/rotation/pan states\n",
145+
"vc.link_views_by_dict([spatialThreeView, lcView, neuroglancerView], {\n",
146+
" \"spatialRenderingMode\": '3D',\n",
147+
" \"spatialZoom\": 0,\n",
148+
" \"spatialTargetT\": 0,\n",
149+
" \"spatialTargetX\": 0,\n",
150+
" \"spatialTargetY\": 0,\n",
151+
" \"spatialTargetZ\": 0,\n",
152+
" \"spatialRotationX\": 0,\n",
153+
" \"spatialRotationY\": 0,\n",
154+
"}, meta=False);\n",
155+
"\n",
156+
"# Initialize the image properties\n",
157+
"vc.link_views_by_dict([spatialThreeView, lcView], {\n",
158+
" \"imageLayer\": CL([\n",
159+
" {\n",
160+
" \"fileUid\": 'melanoma',\n",
161+
" \"spatialLayerOpacity\": 1,\n",
162+
" \"spatialTargetResolution\": None,\n",
163+
" \"imageChannel\": CL([\n",
164+
" {\n",
165+
" \"spatialTargetC\": 0,\n",
166+
" \"spatialChannelColor\": [255, 0, 0],\n",
167+
" \"spatialChannelVisible\": True,\n",
168+
" \"spatialChannelOpacity\": 1.0,\n",
169+
" },\n",
170+
" ]),\n",
171+
" },\n",
172+
" ]),\n",
173+
"}, scope_prefix=get_initial_coordination_scope_prefix('A', 'image'));\n",
174+
"\n",
175+
"\n",
176+
"vc.layout(hconcat(neuroglancerView, spatialThreeView, vconcat(lcView, obsSets, scatterView)));"
177+
]
178+
},
179+
{
180+
"cell_type": "code",
181+
"execution_count": null,
182+
"metadata": {},
183+
"outputs": [],
184+
"source": [
185+
"vc.to_dict()"
186+
]
187+
},
188+
{
189+
"cell_type": "markdown",
190+
"metadata": {},
191+
"source": [
192+
"## 2. Create the Vitessce widget"
193+
]
194+
},
195+
{
196+
"cell_type": "code",
197+
"execution_count": null,
198+
"metadata": {},
199+
"outputs": [],
200+
"source": [
201+
"vw = vc.widget(js_dev_mode=True)\n",
202+
"vw"
203+
]
204+
},
205+
{
206+
"cell_type": "code",
207+
"execution_count": null,
208+
"metadata": {},
209+
"outputs": [],
210+
"source": []
211+
},
212+
{
213+
"cell_type": "code",
214+
"execution_count": null,
215+
"metadata": {},
216+
"outputs": [],
217+
"source": []
218+
}
219+
],
220+
"metadata": {
221+
"kernelspec": {
222+
"display_name": "Python 3 (ipykernel)",
223+
"language": "python",
224+
"name": "python3"
225+
},
226+
"language_info": {
227+
"codemirror_mode": {
228+
"name": "ipython",
229+
"version": 3
230+
},
231+
"file_extension": ".py",
232+
"mimetype": "text/x-python",
233+
"name": "python",
234+
"nbconvert_exporter": "python",
235+
"pygments_lexer": "ipython3",
236+
"version": "3.10.14"
237+
}
238+
},
239+
"nbformat": 4,
240+
"nbformat_minor": 4
241+
}

pyproject.toml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ build-backend = "hatchling.build"
44

55
[project]
66
name = "vitessce"
7-
version = "3.5.10"
7+
version = "3.5.11"
88
authors = [
99
{ name="Mark Keller", email="mark_keller@hms.harvard.edu" },
1010
]

src/vitessce/widget.py

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -497,7 +497,8 @@ def get_uid_str(uid):
497497
const root = createRoot(view.el);
498498
// Marimo puts AnyWidgets in a Shadow Root, so we need to tell Emotion to
499499
// insert styles within the Shadow DOM.
500-
const styleContainer = view.el.getRootNode();
500+
const rootNode = view.el.getRootNode();
501+
const styleContainer = rootNode === document ? undefined : rootNode;
501502
root.render(e(VitessceWidget, { model: view.model, styleContainer }));
502503
503504
return () => {
@@ -601,7 +602,7 @@ class VitessceWidget(anywidget.AnyWidget):
601602

602603
next_port = DEFAULT_PORT
603604

604-
js_package_version = Unicode('3.5.12').tag(sync=True)
605+
js_package_version = Unicode('3.6.1').tag(sync=True)
605606
js_dev_mode = Bool(False).tag(sync=True)
606607
custom_js_url = Unicode('').tag(sync=True)
607608
plugin_esm = List(trait=Unicode(''), default_value=[]).tag(sync=True)
@@ -613,7 +614,7 @@ class VitessceWidget(anywidget.AnyWidget):
613614

614615
store_urls = List(trait=Unicode(''), default_value=[]).tag(sync=True)
615616

616-
def __init__(self, config, height=600, theme='auto', uid=None, port=None, proxy=False, js_package_version='3.5.12', js_dev_mode=False, custom_js_url='', plugins=None, remount_on_uid_change=True, prefer_local=True, invoke_timeout=300000, invoke_batched=True, page_mode=False, page_esm=None):
617+
def __init__(self, config, height=600, theme='auto', uid=None, port=None, proxy=False, js_package_version='3.6.1', js_dev_mode=False, custom_js_url='', plugins=None, remount_on_uid_change=True, prefer_local=True, invoke_timeout=300000, invoke_batched=True, page_mode=False, page_esm=None):
617618
"""
618619
Construct a new Vitessce widget.
619620
@@ -748,7 +749,7 @@ def _plugin_command(self, params, buffers):
748749
# Launch Vitessce using plain HTML representation (no ipywidgets)
749750

750751

751-
def ipython_display(config, height=600, theme='auto', base_url=None, host_name=None, uid=None, port=None, proxy=False, js_package_version='3.5.12', js_dev_mode=False, custom_js_url='', plugins=None, remount_on_uid_change=True, page_mode=False, page_esm=None):
752+
def ipython_display(config, height=600, theme='auto', base_url=None, host_name=None, uid=None, port=None, proxy=False, js_package_version='3.6.1', js_dev_mode=False, custom_js_url='', plugins=None, remount_on_uid_change=True, page_mode=False, page_esm=None):
752753
from IPython.display import display, HTML
753754
uid_str = "vitessce" + get_uid_str(uid)
754755

0 commit comments

Comments
 (0)