openms-insight 0.1.0__tar.gz
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- openms_insight-0.1.0/.gitignore +63 -0
- openms_insight-0.1.0/LICENSE +29 -0
- openms_insight-0.1.0/PKG-INFO +256 -0
- openms_insight-0.1.0/README.md +221 -0
- openms_insight-0.1.0/openms_insight/__init__.py +32 -0
- openms_insight-0.1.0/openms_insight/components/__init__.py +11 -0
- openms_insight-0.1.0/openms_insight/components/heatmap.py +823 -0
- openms_insight-0.1.0/openms_insight/components/lineplot.py +492 -0
- openms_insight-0.1.0/openms_insight/components/sequenceview.py +384 -0
- openms_insight-0.1.0/openms_insight/components/table.py +400 -0
- openms_insight-0.1.0/openms_insight/core/__init__.py +14 -0
- openms_insight-0.1.0/openms_insight/core/base.py +413 -0
- openms_insight-0.1.0/openms_insight/core/cache.py +39 -0
- openms_insight-0.1.0/openms_insight/core/registry.py +82 -0
- openms_insight-0.1.0/openms_insight/core/state.py +215 -0
- openms_insight-0.1.0/openms_insight/js-component/dist/assets/index.css +5 -0
- openms_insight-0.1.0/openms_insight/js-component/dist/assets/index.js +4220 -0
- openms_insight-0.1.0/openms_insight/js-component/dist/assets/materialdesignicons-webfont.eot +0 -0
- openms_insight-0.1.0/openms_insight/js-component/dist/assets/materialdesignicons-webfont.ttf +0 -0
- openms_insight-0.1.0/openms_insight/js-component/dist/assets/materialdesignicons-webfont.woff +0 -0
- openms_insight-0.1.0/openms_insight/js-component/dist/assets/materialdesignicons-webfont.woff2 +0 -0
- openms_insight-0.1.0/openms_insight/js-component/dist/index.html +14 -0
- openms_insight-0.1.0/openms_insight/preprocessing/__init__.py +22 -0
- openms_insight-0.1.0/openms_insight/preprocessing/compression.py +338 -0
- openms_insight-0.1.0/openms_insight/preprocessing/filtering.py +316 -0
- openms_insight-0.1.0/openms_insight/rendering/__init__.py +8 -0
- openms_insight-0.1.0/openms_insight/rendering/bridge.py +312 -0
- openms_insight-0.1.0/pyproject.toml +117 -0
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
# Python
|
|
2
|
+
__pycache__/
|
|
3
|
+
*.py[cod]
|
|
4
|
+
*$py.class
|
|
5
|
+
*.so
|
|
6
|
+
.Python
|
|
7
|
+
build/
|
|
8
|
+
develop-eggs/
|
|
9
|
+
dist/
|
|
10
|
+
downloads/
|
|
11
|
+
eggs/
|
|
12
|
+
.eggs/
|
|
13
|
+
lib/
|
|
14
|
+
lib64/
|
|
15
|
+
parts/
|
|
16
|
+
sdist/
|
|
17
|
+
var/
|
|
18
|
+
wheels/
|
|
19
|
+
*.egg-info/
|
|
20
|
+
.installed.cfg
|
|
21
|
+
*.egg
|
|
22
|
+
|
|
23
|
+
# Virtual environments
|
|
24
|
+
.env
|
|
25
|
+
.venv
|
|
26
|
+
env/
|
|
27
|
+
venv/
|
|
28
|
+
ENV/
|
|
29
|
+
|
|
30
|
+
# IDE
|
|
31
|
+
.idea/
|
|
32
|
+
.vscode/
|
|
33
|
+
*.swp
|
|
34
|
+
*.swo
|
|
35
|
+
*~
|
|
36
|
+
|
|
37
|
+
# Testing
|
|
38
|
+
.coverage
|
|
39
|
+
htmlcov/
|
|
40
|
+
.pytest_cache/
|
|
41
|
+
.mypy_cache/
|
|
42
|
+
|
|
43
|
+
# Jupyter
|
|
44
|
+
.ipynb_checkpoints/
|
|
45
|
+
|
|
46
|
+
# Component save files
|
|
47
|
+
*.svcomp
|
|
48
|
+
|
|
49
|
+
# Node.js
|
|
50
|
+
node_modules/
|
|
51
|
+
npm-debug.log*
|
|
52
|
+
yarn-debug.log*
|
|
53
|
+
yarn-error.log*
|
|
54
|
+
|
|
55
|
+
# Vue/Vite build output
|
|
56
|
+
js-component/dist/
|
|
57
|
+
|
|
58
|
+
# OS
|
|
59
|
+
.DS_Store
|
|
60
|
+
Thumbs.db
|
|
61
|
+
|
|
62
|
+
# Logs
|
|
63
|
+
*.log
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
--------------------------------------------------------------------------
|
|
2
|
+
OpenMS -- Open-Source Mass Spectrometry
|
|
3
|
+
--------------------------------------------------------------------------
|
|
4
|
+
Copyright OpenMS Inc. -- Eberhard Karls University Tuebingen,
|
|
5
|
+
ETH Zurich, and Freie Universitaet Berlin 2002-present.
|
|
6
|
+
|
|
7
|
+
This software is released under a three-clause BSD license:
|
|
8
|
+
* Redistributions of source code must retain the above copyright
|
|
9
|
+
notice, this list of conditions and the following disclaimer.
|
|
10
|
+
* Redistributions in binary form must reproduce the above copyright
|
|
11
|
+
notice, this list of conditions and the following disclaimer in the
|
|
12
|
+
documentation and/or other materials provided with the distribution.
|
|
13
|
+
* Neither the name of any author or any participating institution
|
|
14
|
+
may be used to endorse or promote products derived from this software
|
|
15
|
+
without specific prior written permission.
|
|
16
|
+
For a full list of authors, refer to the git contributions.
|
|
17
|
+
--------------------------------------------------------------------------
|
|
18
|
+
THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
|
|
19
|
+
AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
|
|
20
|
+
IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
|
|
21
|
+
ARE DISCLAIMED. IN NO EVENT SHALL ANY OF THE AUTHORS OR THE CONTRIBUTING
|
|
22
|
+
INSTITUTIONS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
|
|
23
|
+
EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
|
|
24
|
+
PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS;
|
|
25
|
+
OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY,
|
|
26
|
+
WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR
|
|
27
|
+
OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF
|
|
28
|
+
ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
|
|
29
|
+
|
|
@@ -0,0 +1,256 @@
|
|
|
1
|
+
Metadata-Version: 2.4
|
|
2
|
+
Name: openms-insight
|
|
3
|
+
Version: 0.1.0
|
|
4
|
+
Summary: Interactive visualization components for mass spectrometry data in Streamlit
|
|
5
|
+
Project-URL: Homepage, https://github.com/t0mdavid-m/OpenMS-Insight
|
|
6
|
+
Project-URL: Documentation, https://github.com/t0mdavid-m/OpenMS-Insight#readme
|
|
7
|
+
Project-URL: Repository, https://github.com/t0mdavid-m/OpenMS-Insight
|
|
8
|
+
Project-URL: Issues, https://github.com/t0mdavid-m/OpenMS-Insight/issues
|
|
9
|
+
Author: Kohlbacher Lab
|
|
10
|
+
License-Expression: BSD-3-Clause
|
|
11
|
+
License-File: LICENSE
|
|
12
|
+
Keywords: mass-spectrometry,openms,plotly,proteomics,streamlit,tabulator,visualization,vue
|
|
13
|
+
Classifier: Development Status :: 4 - Beta
|
|
14
|
+
Classifier: Intended Audience :: Developers
|
|
15
|
+
Classifier: Intended Audience :: Science/Research
|
|
16
|
+
Classifier: License :: OSI Approved :: BSD License
|
|
17
|
+
Classifier: Programming Language :: Python :: 3
|
|
18
|
+
Classifier: Programming Language :: Python :: 3.9
|
|
19
|
+
Classifier: Programming Language :: Python :: 3.10
|
|
20
|
+
Classifier: Programming Language :: Python :: 3.11
|
|
21
|
+
Classifier: Programming Language :: Python :: 3.12
|
|
22
|
+
Classifier: Topic :: Scientific/Engineering :: Bio-Informatics
|
|
23
|
+
Classifier: Topic :: Scientific/Engineering :: Visualization
|
|
24
|
+
Requires-Python: >=3.9
|
|
25
|
+
Requires-Dist: pandas>=1.5.0
|
|
26
|
+
Requires-Dist: polars>=0.19.0
|
|
27
|
+
Requires-Dist: streamlit>=1.20.0
|
|
28
|
+
Provides-Extra: dev
|
|
29
|
+
Requires-Dist: black>=23.0.0; extra == 'dev'
|
|
30
|
+
Requires-Dist: mypy>=1.0.0; extra == 'dev'
|
|
31
|
+
Requires-Dist: pytest-cov>=4.0.0; extra == 'dev'
|
|
32
|
+
Requires-Dist: pytest>=7.0.0; extra == 'dev'
|
|
33
|
+
Requires-Dist: ruff>=0.1.0; extra == 'dev'
|
|
34
|
+
Description-Content-Type: text/markdown
|
|
35
|
+
|
|
36
|
+
# OpenMS-Insight
|
|
37
|
+
|
|
38
|
+
[](https://badge.fury.io/py/openms-insight)
|
|
39
|
+
[](https://www.python.org/downloads/)
|
|
40
|
+
|
|
41
|
+
Interactive visualization components for mass spectrometry data in Streamlit, backed by Vue.js.
|
|
42
|
+
|
|
43
|
+
## Features
|
|
44
|
+
|
|
45
|
+
- **Cross-component selection linking** via shared identifiers
|
|
46
|
+
- **Polars LazyFrame support** for efficient data handling
|
|
47
|
+
- **Automatic disk caching** with config-based invalidation
|
|
48
|
+
- **Table component** (Tabulator.js) with filtering, sorting, go-to, pagination
|
|
49
|
+
- **Line plot component** (Plotly.js) with highlighting, annotations, zoom
|
|
50
|
+
- **Heatmap component** (Plotly scattergl) with multi-resolution downsampling
|
|
51
|
+
- **Sequence view component** for peptide/protein visualization
|
|
52
|
+
|
|
53
|
+
## Installation
|
|
54
|
+
|
|
55
|
+
```bash
|
|
56
|
+
pip install openms-insight
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
## Quick Start
|
|
60
|
+
|
|
61
|
+
```python
|
|
62
|
+
import streamlit as st
|
|
63
|
+
import polars as pl
|
|
64
|
+
from openms_insight import Table, LinePlot, StateManager
|
|
65
|
+
|
|
66
|
+
# Create state manager for cross-component linking
|
|
67
|
+
state_manager = StateManager()
|
|
68
|
+
|
|
69
|
+
# Create a table - clicking a row sets the 'item' selection
|
|
70
|
+
table = Table(
|
|
71
|
+
cache_id="items_table",
|
|
72
|
+
data=pl.scan_parquet("items.parquet"),
|
|
73
|
+
interactivity={'item': 'item_id'},
|
|
74
|
+
column_definitions=[
|
|
75
|
+
{'field': 'item_id', 'title': 'ID', 'sorter': 'number'},
|
|
76
|
+
{'field': 'name', 'title': 'Name'},
|
|
77
|
+
],
|
|
78
|
+
)
|
|
79
|
+
table(state_manager=state_manager)
|
|
80
|
+
|
|
81
|
+
# Create a linked plot - filters by the selected 'item'
|
|
82
|
+
plot = LinePlot(
|
|
83
|
+
cache_id="values_plot",
|
|
84
|
+
data=pl.scan_parquet("values.parquet"),
|
|
85
|
+
filters={'item': 'item_id'},
|
|
86
|
+
x_column='x',
|
|
87
|
+
y_column='y',
|
|
88
|
+
)
|
|
89
|
+
plot(state_manager=state_manager)
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
## Cross-Component Linking
|
|
93
|
+
|
|
94
|
+
Components communicate through **identifiers** using two mechanisms:
|
|
95
|
+
|
|
96
|
+
- **`filters`**: INPUT - filter this component's data by the selection
|
|
97
|
+
- **`interactivity`**: OUTPUT - set a selection when user clicks
|
|
98
|
+
|
|
99
|
+
```python
|
|
100
|
+
# Master table: no filters, sets 'spectrum' on click
|
|
101
|
+
master = Table(
|
|
102
|
+
cache_id="spectra",
|
|
103
|
+
data=spectra_data,
|
|
104
|
+
interactivity={'spectrum': 'scan_id'}, # Click -> sets spectrum=scan_id
|
|
105
|
+
)
|
|
106
|
+
|
|
107
|
+
# Detail table: filters by 'spectrum', sets 'peak' on click
|
|
108
|
+
detail = Table(
|
|
109
|
+
cache_id="peaks",
|
|
110
|
+
data=peaks_data,
|
|
111
|
+
filters={'spectrum': 'scan_id'}, # Filters where scan_id = selected spectrum
|
|
112
|
+
interactivity={'peak': 'peak_id'}, # Click -> sets peak=peak_id
|
|
113
|
+
)
|
|
114
|
+
|
|
115
|
+
# Plot: filters by 'spectrum', highlights selected 'peak'
|
|
116
|
+
plot = LinePlot(
|
|
117
|
+
cache_id="plot",
|
|
118
|
+
data=peaks_data,
|
|
119
|
+
filters={'spectrum': 'scan_id'},
|
|
120
|
+
interactivity={'peak': 'peak_id'},
|
|
121
|
+
x_column='mass',
|
|
122
|
+
y_column='intensity',
|
|
123
|
+
)
|
|
124
|
+
```
|
|
125
|
+
|
|
126
|
+
---
|
|
127
|
+
|
|
128
|
+
## Components
|
|
129
|
+
|
|
130
|
+
### Table
|
|
131
|
+
|
|
132
|
+
Interactive table using Tabulator.js with filtering dialogs, sorting, pagination, and CSV export.
|
|
133
|
+
|
|
134
|
+
```python
|
|
135
|
+
Table(
|
|
136
|
+
cache_id="spectra_table",
|
|
137
|
+
data=pl.scan_parquet("spectra.parquet"),
|
|
138
|
+
interactivity={'spectrum': 'scan_id'},
|
|
139
|
+
column_definitions=[
|
|
140
|
+
{'field': 'scan_id', 'title': 'Scan', 'sorter': 'number'},
|
|
141
|
+
{'field': 'rt', 'title': 'RT (min)', 'sorter': 'number', 'hozAlign': 'right'},
|
|
142
|
+
{'field': 'precursor_mz', 'title': 'm/z', 'sorter': 'number'},
|
|
143
|
+
],
|
|
144
|
+
index_field='scan_id',
|
|
145
|
+
go_to_fields=['scan_id'],
|
|
146
|
+
default_row=0,
|
|
147
|
+
pagination=True,
|
|
148
|
+
page_size=50,
|
|
149
|
+
)
|
|
150
|
+
```
|
|
151
|
+
|
|
152
|
+
### LinePlot
|
|
153
|
+
|
|
154
|
+
Stick-style line plot using Plotly.js for mass spectra visualization.
|
|
155
|
+
|
|
156
|
+
```python
|
|
157
|
+
LinePlot(
|
|
158
|
+
cache_id="spectrum_plot",
|
|
159
|
+
data=pl.scan_parquet("peaks.parquet"),
|
|
160
|
+
filters={'spectrum': 'scan_id'},
|
|
161
|
+
interactivity={'peak': 'peak_id'},
|
|
162
|
+
x_column='mass',
|
|
163
|
+
y_column='intensity',
|
|
164
|
+
highlight_column='is_annotated',
|
|
165
|
+
annotation_column='ion_label',
|
|
166
|
+
title="MS/MS Spectrum",
|
|
167
|
+
x_label="m/z",
|
|
168
|
+
y_label="Intensity",
|
|
169
|
+
)
|
|
170
|
+
```
|
|
171
|
+
|
|
172
|
+
### Heatmap
|
|
173
|
+
|
|
174
|
+
2D scatter heatmap using Plotly scattergl with multi-resolution downsampling for large datasets (millions of points).
|
|
175
|
+
|
|
176
|
+
```python
|
|
177
|
+
Heatmap(
|
|
178
|
+
cache_id="peaks_heatmap",
|
|
179
|
+
data=pl.scan_parquet("all_peaks.parquet"),
|
|
180
|
+
x_column='retention_time',
|
|
181
|
+
y_column='mass',
|
|
182
|
+
intensity_column='intensity',
|
|
183
|
+
interactivity={'spectrum': 'scan_id', 'peak': 'peak_id'},
|
|
184
|
+
min_points=30000,
|
|
185
|
+
title="Peak Map",
|
|
186
|
+
x_label="Retention Time (min)",
|
|
187
|
+
y_label="m/z",
|
|
188
|
+
)
|
|
189
|
+
```
|
|
190
|
+
|
|
191
|
+
### SequenceView
|
|
192
|
+
|
|
193
|
+
Peptide/protein sequence visualization with fragment ion matching.
|
|
194
|
+
|
|
195
|
+
```python
|
|
196
|
+
SequenceView(
|
|
197
|
+
cache_id="peptide_view",
|
|
198
|
+
sequence="PEPTIDEK",
|
|
199
|
+
observed_masses=[147.1, 244.2, 359.3, 456.4],
|
|
200
|
+
peak_ids=[0, 1, 2, 3],
|
|
201
|
+
precursor_mass=944.5,
|
|
202
|
+
interactivity={'peak': 'peak_id'},
|
|
203
|
+
title="Fragment Coverage",
|
|
204
|
+
)
|
|
205
|
+
```
|
|
206
|
+
|
|
207
|
+
---
|
|
208
|
+
|
|
209
|
+
## Shared Component Arguments
|
|
210
|
+
|
|
211
|
+
All components accept these common arguments:
|
|
212
|
+
|
|
213
|
+
| Argument | Type | Default | Description |
|
|
214
|
+
|----------|------|---------|-------------|
|
|
215
|
+
| `cache_id` | `str` | **Required** | Unique identifier for disk cache |
|
|
216
|
+
| `data` | `pl.LazyFrame` | `None` | Polars LazyFrame with source data |
|
|
217
|
+
| `filters` | `Dict[str, str]` | `None` | Map identifier -> column for filtering |
|
|
218
|
+
| `interactivity` | `Dict[str, str]` | `None` | Map identifier -> column for click actions |
|
|
219
|
+
| `cache_path` | `str` | `"."` | Base directory for cache storage |
|
|
220
|
+
|
|
221
|
+
## Rendering
|
|
222
|
+
|
|
223
|
+
All components are callable. Pass a `StateManager` to enable cross-component linking:
|
|
224
|
+
|
|
225
|
+
```python
|
|
226
|
+
from openms_insight import StateManager
|
|
227
|
+
|
|
228
|
+
state_manager = StateManager()
|
|
229
|
+
|
|
230
|
+
table(state_manager=state_manager, height=300)
|
|
231
|
+
plot(state_manager=state_manager, height=400)
|
|
232
|
+
```
|
|
233
|
+
|
|
234
|
+
---
|
|
235
|
+
|
|
236
|
+
## Development
|
|
237
|
+
|
|
238
|
+
### Building the Vue Component
|
|
239
|
+
|
|
240
|
+
```bash
|
|
241
|
+
cd js-component
|
|
242
|
+
npm install
|
|
243
|
+
npm run build
|
|
244
|
+
```
|
|
245
|
+
|
|
246
|
+
### Development Mode
|
|
247
|
+
|
|
248
|
+
```bash
|
|
249
|
+
cd js-component
|
|
250
|
+
npm run dev
|
|
251
|
+
|
|
252
|
+
# In another terminal:
|
|
253
|
+
export SVC_DEV_MODE=true
|
|
254
|
+
export SVC_DEV_URL=http://localhost:5173
|
|
255
|
+
streamlit run app.py
|
|
256
|
+
```
|
|
@@ -0,0 +1,221 @@
|
|
|
1
|
+
# OpenMS-Insight
|
|
2
|
+
|
|
3
|
+
[](https://badge.fury.io/py/openms-insight)
|
|
4
|
+
[](https://www.python.org/downloads/)
|
|
5
|
+
|
|
6
|
+
Interactive visualization components for mass spectrometry data in Streamlit, backed by Vue.js.
|
|
7
|
+
|
|
8
|
+
## Features
|
|
9
|
+
|
|
10
|
+
- **Cross-component selection linking** via shared identifiers
|
|
11
|
+
- **Polars LazyFrame support** for efficient data handling
|
|
12
|
+
- **Automatic disk caching** with config-based invalidation
|
|
13
|
+
- **Table component** (Tabulator.js) with filtering, sorting, go-to, pagination
|
|
14
|
+
- **Line plot component** (Plotly.js) with highlighting, annotations, zoom
|
|
15
|
+
- **Heatmap component** (Plotly scattergl) with multi-resolution downsampling
|
|
16
|
+
- **Sequence view component** for peptide/protein visualization
|
|
17
|
+
|
|
18
|
+
## Installation
|
|
19
|
+
|
|
20
|
+
```bash
|
|
21
|
+
pip install openms-insight
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
## Quick Start
|
|
25
|
+
|
|
26
|
+
```python
|
|
27
|
+
import streamlit as st
|
|
28
|
+
import polars as pl
|
|
29
|
+
from openms_insight import Table, LinePlot, StateManager
|
|
30
|
+
|
|
31
|
+
# Create state manager for cross-component linking
|
|
32
|
+
state_manager = StateManager()
|
|
33
|
+
|
|
34
|
+
# Create a table - clicking a row sets the 'item' selection
|
|
35
|
+
table = Table(
|
|
36
|
+
cache_id="items_table",
|
|
37
|
+
data=pl.scan_parquet("items.parquet"),
|
|
38
|
+
interactivity={'item': 'item_id'},
|
|
39
|
+
column_definitions=[
|
|
40
|
+
{'field': 'item_id', 'title': 'ID', 'sorter': 'number'},
|
|
41
|
+
{'field': 'name', 'title': 'Name'},
|
|
42
|
+
],
|
|
43
|
+
)
|
|
44
|
+
table(state_manager=state_manager)
|
|
45
|
+
|
|
46
|
+
# Create a linked plot - filters by the selected 'item'
|
|
47
|
+
plot = LinePlot(
|
|
48
|
+
cache_id="values_plot",
|
|
49
|
+
data=pl.scan_parquet("values.parquet"),
|
|
50
|
+
filters={'item': 'item_id'},
|
|
51
|
+
x_column='x',
|
|
52
|
+
y_column='y',
|
|
53
|
+
)
|
|
54
|
+
plot(state_manager=state_manager)
|
|
55
|
+
```
|
|
56
|
+
|
|
57
|
+
## Cross-Component Linking
|
|
58
|
+
|
|
59
|
+
Components communicate through **identifiers** using two mechanisms:
|
|
60
|
+
|
|
61
|
+
- **`filters`**: INPUT - filter this component's data by the selection
|
|
62
|
+
- **`interactivity`**: OUTPUT - set a selection when user clicks
|
|
63
|
+
|
|
64
|
+
```python
|
|
65
|
+
# Master table: no filters, sets 'spectrum' on click
|
|
66
|
+
master = Table(
|
|
67
|
+
cache_id="spectra",
|
|
68
|
+
data=spectra_data,
|
|
69
|
+
interactivity={'spectrum': 'scan_id'}, # Click -> sets spectrum=scan_id
|
|
70
|
+
)
|
|
71
|
+
|
|
72
|
+
# Detail table: filters by 'spectrum', sets 'peak' on click
|
|
73
|
+
detail = Table(
|
|
74
|
+
cache_id="peaks",
|
|
75
|
+
data=peaks_data,
|
|
76
|
+
filters={'spectrum': 'scan_id'}, # Filters where scan_id = selected spectrum
|
|
77
|
+
interactivity={'peak': 'peak_id'}, # Click -> sets peak=peak_id
|
|
78
|
+
)
|
|
79
|
+
|
|
80
|
+
# Plot: filters by 'spectrum', highlights selected 'peak'
|
|
81
|
+
plot = LinePlot(
|
|
82
|
+
cache_id="plot",
|
|
83
|
+
data=peaks_data,
|
|
84
|
+
filters={'spectrum': 'scan_id'},
|
|
85
|
+
interactivity={'peak': 'peak_id'},
|
|
86
|
+
x_column='mass',
|
|
87
|
+
y_column='intensity',
|
|
88
|
+
)
|
|
89
|
+
```
|
|
90
|
+
|
|
91
|
+
---
|
|
92
|
+
|
|
93
|
+
## Components
|
|
94
|
+
|
|
95
|
+
### Table
|
|
96
|
+
|
|
97
|
+
Interactive table using Tabulator.js with filtering dialogs, sorting, pagination, and CSV export.
|
|
98
|
+
|
|
99
|
+
```python
|
|
100
|
+
Table(
|
|
101
|
+
cache_id="spectra_table",
|
|
102
|
+
data=pl.scan_parquet("spectra.parquet"),
|
|
103
|
+
interactivity={'spectrum': 'scan_id'},
|
|
104
|
+
column_definitions=[
|
|
105
|
+
{'field': 'scan_id', 'title': 'Scan', 'sorter': 'number'},
|
|
106
|
+
{'field': 'rt', 'title': 'RT (min)', 'sorter': 'number', 'hozAlign': 'right'},
|
|
107
|
+
{'field': 'precursor_mz', 'title': 'm/z', 'sorter': 'number'},
|
|
108
|
+
],
|
|
109
|
+
index_field='scan_id',
|
|
110
|
+
go_to_fields=['scan_id'],
|
|
111
|
+
default_row=0,
|
|
112
|
+
pagination=True,
|
|
113
|
+
page_size=50,
|
|
114
|
+
)
|
|
115
|
+
```
|
|
116
|
+
|
|
117
|
+
### LinePlot
|
|
118
|
+
|
|
119
|
+
Stick-style line plot using Plotly.js for mass spectra visualization.
|
|
120
|
+
|
|
121
|
+
```python
|
|
122
|
+
LinePlot(
|
|
123
|
+
cache_id="spectrum_plot",
|
|
124
|
+
data=pl.scan_parquet("peaks.parquet"),
|
|
125
|
+
filters={'spectrum': 'scan_id'},
|
|
126
|
+
interactivity={'peak': 'peak_id'},
|
|
127
|
+
x_column='mass',
|
|
128
|
+
y_column='intensity',
|
|
129
|
+
highlight_column='is_annotated',
|
|
130
|
+
annotation_column='ion_label',
|
|
131
|
+
title="MS/MS Spectrum",
|
|
132
|
+
x_label="m/z",
|
|
133
|
+
y_label="Intensity",
|
|
134
|
+
)
|
|
135
|
+
```
|
|
136
|
+
|
|
137
|
+
### Heatmap
|
|
138
|
+
|
|
139
|
+
2D scatter heatmap using Plotly scattergl with multi-resolution downsampling for large datasets (millions of points).
|
|
140
|
+
|
|
141
|
+
```python
|
|
142
|
+
Heatmap(
|
|
143
|
+
cache_id="peaks_heatmap",
|
|
144
|
+
data=pl.scan_parquet("all_peaks.parquet"),
|
|
145
|
+
x_column='retention_time',
|
|
146
|
+
y_column='mass',
|
|
147
|
+
intensity_column='intensity',
|
|
148
|
+
interactivity={'spectrum': 'scan_id', 'peak': 'peak_id'},
|
|
149
|
+
min_points=30000,
|
|
150
|
+
title="Peak Map",
|
|
151
|
+
x_label="Retention Time (min)",
|
|
152
|
+
y_label="m/z",
|
|
153
|
+
)
|
|
154
|
+
```
|
|
155
|
+
|
|
156
|
+
### SequenceView
|
|
157
|
+
|
|
158
|
+
Peptide/protein sequence visualization with fragment ion matching.
|
|
159
|
+
|
|
160
|
+
```python
|
|
161
|
+
SequenceView(
|
|
162
|
+
cache_id="peptide_view",
|
|
163
|
+
sequence="PEPTIDEK",
|
|
164
|
+
observed_masses=[147.1, 244.2, 359.3, 456.4],
|
|
165
|
+
peak_ids=[0, 1, 2, 3],
|
|
166
|
+
precursor_mass=944.5,
|
|
167
|
+
interactivity={'peak': 'peak_id'},
|
|
168
|
+
title="Fragment Coverage",
|
|
169
|
+
)
|
|
170
|
+
```
|
|
171
|
+
|
|
172
|
+
---
|
|
173
|
+
|
|
174
|
+
## Shared Component Arguments
|
|
175
|
+
|
|
176
|
+
All components accept these common arguments:
|
|
177
|
+
|
|
178
|
+
| Argument | Type | Default | Description |
|
|
179
|
+
|----------|------|---------|-------------|
|
|
180
|
+
| `cache_id` | `str` | **Required** | Unique identifier for disk cache |
|
|
181
|
+
| `data` | `pl.LazyFrame` | `None` | Polars LazyFrame with source data |
|
|
182
|
+
| `filters` | `Dict[str, str]` | `None` | Map identifier -> column for filtering |
|
|
183
|
+
| `interactivity` | `Dict[str, str]` | `None` | Map identifier -> column for click actions |
|
|
184
|
+
| `cache_path` | `str` | `"."` | Base directory for cache storage |
|
|
185
|
+
|
|
186
|
+
## Rendering
|
|
187
|
+
|
|
188
|
+
All components are callable. Pass a `StateManager` to enable cross-component linking:
|
|
189
|
+
|
|
190
|
+
```python
|
|
191
|
+
from openms_insight import StateManager
|
|
192
|
+
|
|
193
|
+
state_manager = StateManager()
|
|
194
|
+
|
|
195
|
+
table(state_manager=state_manager, height=300)
|
|
196
|
+
plot(state_manager=state_manager, height=400)
|
|
197
|
+
```
|
|
198
|
+
|
|
199
|
+
---
|
|
200
|
+
|
|
201
|
+
## Development
|
|
202
|
+
|
|
203
|
+
### Building the Vue Component
|
|
204
|
+
|
|
205
|
+
```bash
|
|
206
|
+
cd js-component
|
|
207
|
+
npm install
|
|
208
|
+
npm run build
|
|
209
|
+
```
|
|
210
|
+
|
|
211
|
+
### Development Mode
|
|
212
|
+
|
|
213
|
+
```bash
|
|
214
|
+
cd js-component
|
|
215
|
+
npm run dev
|
|
216
|
+
|
|
217
|
+
# In another terminal:
|
|
218
|
+
export SVC_DEV_MODE=true
|
|
219
|
+
export SVC_DEV_URL=http://localhost:5173
|
|
220
|
+
streamlit run app.py
|
|
221
|
+
```
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"""
|
|
2
|
+
Streamlit Vue Components - Interactive visualization components for Streamlit.
|
|
3
|
+
|
|
4
|
+
This package provides reusable, interactive Streamlit components backed by Vue.js
|
|
5
|
+
visualizations with cross-component selection state management.
|
|
6
|
+
"""
|
|
7
|
+
|
|
8
|
+
from .core.base import BaseComponent
|
|
9
|
+
from .core.state import StateManager
|
|
10
|
+
from .core.registry import register_component, get_component_class
|
|
11
|
+
from .core.cache import CacheMissError
|
|
12
|
+
|
|
13
|
+
from .components.table import Table
|
|
14
|
+
from .components.lineplot import LinePlot
|
|
15
|
+
from .components.heatmap import Heatmap
|
|
16
|
+
from .components.sequenceview import SequenceView
|
|
17
|
+
|
|
18
|
+
__version__ = "0.1.0"
|
|
19
|
+
|
|
20
|
+
__all__ = [
|
|
21
|
+
# Core
|
|
22
|
+
"BaseComponent",
|
|
23
|
+
"StateManager",
|
|
24
|
+
"register_component",
|
|
25
|
+
"get_component_class",
|
|
26
|
+
"CacheMissError",
|
|
27
|
+
# Components
|
|
28
|
+
"Table",
|
|
29
|
+
"LinePlot",
|
|
30
|
+
"Heatmap",
|
|
31
|
+
"SequenceView",
|
|
32
|
+
]
|