Diff of /docs/tutorials.html [000000] .. [413088]

Switch to unified view

a b/docs/tutorials.html
1
<!DOCTYPE html>
2
3
<html>
4
5
<head>
6
7
<meta charset="utf-8" />
8
<meta name="generator" content="pandoc" />
9
<meta http-equiv="X-UA-Compatible" content="IE=EDGE" />
10
11
12
13
14
<title>Tutorials</title>
15
16
<script src="site_libs/header-attrs-2.29/header-attrs.js"></script>
17
<script src="site_libs/jquery-3.6.0/jquery-3.6.0.min.js"></script>
18
<meta name="viewport" content="width=device-width, initial-scale=1" />
19
<link href="site_libs/bootstrap-3.3.5/css/flatly.min.css" rel="stylesheet" />
20
<script src="site_libs/bootstrap-3.3.5/js/bootstrap.min.js"></script>
21
<script src="site_libs/bootstrap-3.3.5/shim/html5shiv.min.js"></script>
22
<script src="site_libs/bootstrap-3.3.5/shim/respond.min.js"></script>
23
<style>h1 {font-size: 34px;}
24
       h1.title {font-size: 38px;}
25
       h2 {font-size: 30px;}
26
       h3 {font-size: 24px;}
27
       h4 {font-size: 18px;}
28
       h5 {font-size: 16px;}
29
       h6 {font-size: 12px;}
30
       code {color: inherit; background-color: rgba(0, 0, 0, 0.04);}
31
       pre:not([class]) { background-color: white }</style>
32
<script src="site_libs/navigation-1.1/tabsets.js"></script>
33
<link href="site_libs/highlightjs-9.12.0/textmate.css" rel="stylesheet" />
34
<script src="site_libs/highlightjs-9.12.0/highlight.js"></script>
35
<link href="site_libs/font-awesome-6.5.2/css/all.min.css" rel="stylesheet" />
36
<link href="site_libs/font-awesome-6.5.2/css/v4-shims.min.css" rel="stylesheet" />
37
38
<style type="text/css">
39
  code{white-space: pre-wrap;}
40
  span.smallcaps{font-variant: small-caps;}
41
  span.underline{text-decoration: underline;}
42
  div.column{display: inline-block; vertical-align: top; width: 50%;}
43
  div.hanging-indent{margin-left: 1.5em; text-indent: -1.5em;}
44
  ul.task-list{list-style: none;}
45
    </style>
46
47
<style type="text/css">code{white-space: pre;}</style>
48
<script type="text/javascript">
49
if (window.hljs) {
50
  hljs.configure({languages: []});
51
  hljs.initHighlightingOnLoad();
52
  if (document.readyState && document.readyState === "complete") {
53
    window.setTimeout(function() { hljs.initHighlighting(); }, 0);
54
  }
55
}
56
</script>
57
58
59
60
61
62
63
64
65
66
<style type = "text/css">
67
.main-container {
68
  max-width: 940px;
69
  margin-left: auto;
70
  margin-right: auto;
71
}
72
img {
73
  max-width:100%;
74
}
75
.tabbed-pane {
76
  padding-top: 12px;
77
}
78
.html-widget {
79
  margin-bottom: 20px;
80
}
81
button.code-folding-btn:focus {
82
  outline: none;
83
}
84
summary {
85
  display: list-item;
86
}
87
details > summary > p:only-child {
88
  display: inline;
89
}
90
pre code {
91
  padding: 0;
92
}
93
</style>
94
95
96
<style type="text/css">
97
.dropdown-submenu {
98
  position: relative;
99
}
100
.dropdown-submenu>.dropdown-menu {
101
  top: 0;
102
  left: 100%;
103
  margin-top: -6px;
104
  margin-left: -1px;
105
  border-radius: 0 6px 6px 6px;
106
}
107
.dropdown-submenu:hover>.dropdown-menu {
108
  display: block;
109
}
110
.dropdown-submenu>a:after {
111
  display: block;
112
  content: " ";
113
  float: right;
114
  width: 0;
115
  height: 0;
116
  border-color: transparent;
117
  border-style: solid;
118
  border-width: 5px 0 5px 5px;
119
  border-left-color: #cccccc;
120
  margin-top: 5px;
121
  margin-right: -10px;
122
}
123
.dropdown-submenu:hover>a:after {
124
  border-left-color: #adb5bd;
125
}
126
.dropdown-submenu.pull-left {
127
  float: none;
128
}
129
.dropdown-submenu.pull-left>.dropdown-menu {
130
  left: -100%;
131
  margin-left: 10px;
132
  border-radius: 6px 0 6px 6px;
133
}
134
</style>
135
136
<script type="text/javascript">
137
// manage active state of menu based on current page
138
$(document).ready(function () {
139
  // active menu anchor
140
  href = window.location.pathname
141
  href = href.substr(href.lastIndexOf('/') + 1)
142
  if (href === "")
143
    href = "index.html";
144
  var menuAnchor = $('a[href="' + href + '"]');
145
146
  // mark the anchor link active (and if it's in a dropdown, also mark that active)
147
  var dropdown = menuAnchor.closest('li.dropdown');
148
  if (window.bootstrap) { // Bootstrap 4+
149
    menuAnchor.addClass('active');
150
    dropdown.find('> .dropdown-toggle').addClass('active');
151
  } else { // Bootstrap 3
152
    menuAnchor.parent().addClass('active');
153
    dropdown.addClass('active');
154
  }
155
156
  // Navbar adjustments
157
  var navHeight = $(".navbar").first().height() + 15;
158
  var style = document.createElement('style');
159
  var pt = "padding-top: " + navHeight + "px; ";
160
  var mt = "margin-top: -" + navHeight + "px; ";
161
  var css = "";
162
  // offset scroll position for anchor links (for fixed navbar)
163
  for (var i = 1; i <= 6; i++) {
164
    css += ".section h" + i + "{ " + pt + mt + "}\n";
165
  }
166
  style.innerHTML = "body {" + pt + "padding-bottom: 40px; }\n" + css;
167
  document.head.appendChild(style);
168
});
169
</script>
170
171
<!-- tabsets -->
172
173
<style type="text/css">
174
.tabset-dropdown > .nav-tabs {
175
  display: inline-table;
176
  max-height: 500px;
177
  min-height: 44px;
178
  overflow-y: auto;
179
  border: 1px solid #ddd;
180
  border-radius: 4px;
181
}
182
183
.tabset-dropdown > .nav-tabs > li.active:before, .tabset-dropdown > .nav-tabs.nav-tabs-open:before {
184
  content: "\e259";
185
  font-family: 'Glyphicons Halflings';
186
  display: inline-block;
187
  padding: 10px;
188
  border-right: 1px solid #ddd;
189
}
190
191
.tabset-dropdown > .nav-tabs.nav-tabs-open > li.active:before {
192
  content: "\e258";
193
  font-family: 'Glyphicons Halflings';
194
  border: none;
195
}
196
197
.tabset-dropdown > .nav-tabs > li.active {
198
  display: block;
199
}
200
201
.tabset-dropdown > .nav-tabs > li > a,
202
.tabset-dropdown > .nav-tabs > li > a:focus,
203
.tabset-dropdown > .nav-tabs > li > a:hover {
204
  border: none;
205
  display: inline-block;
206
  border-radius: 4px;
207
  background-color: transparent;
208
}
209
210
.tabset-dropdown > .nav-tabs.nav-tabs-open > li {
211
  display: block;
212
  float: none;
213
}
214
215
.tabset-dropdown > .nav-tabs > li {
216
  display: none;
217
}
218
</style>
219
220
<!-- code folding -->
221
222
223
224
225
</head>
226
227
<body>
228
229
230
<div class="container-fluid main-container">
231
232
233
234
235
<div class="navbar navbar-default  navbar-fixed-top" role="navigation">
236
  <div class="container">
237
    <div class="navbar-header">
238
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-bs-toggle="collapse" data-target="#navbar" data-bs-target="#navbar">
239
        <span class="icon-bar"></span>
240
        <span class="icon-bar"></span>
241
        <span class="icon-bar"></span>
242
      </button>
243
      <a class="navbar-brand" href="index.html">VoltRon</a>
244
    </div>
245
    <div id="navbar" class="navbar-collapse collapse">
246
      <ul class="nav navbar-nav">
247
        <li>
248
  <a href="tutorials.html">Explore</a>
249
</li>
250
<li class="dropdown">
251
  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
252
    Vignette
253
     
254
    <span class="caret"></span>
255
  </a>
256
  <ul class="dropdown-menu" role="menu">
257
    <li class="dropdown-submenu">
258
      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">Spatial Data Integration</a>
259
      <ul class="dropdown-menu" role="menu">
260
        <li>
261
          <a href="registration.html">Spatial Data Alignment</a>
262
        </li>
263
        <li>
264
          <a href="multiomic.html">Multi-omic Integration</a>
265
        </li>
266
        <li>
267
          <a href="nicheclustering.html">Niche Clustering</a>
268
        </li>
269
      </ul>
270
    </li>
271
    <li class="dropdown-submenu">
272
      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">Downstream Analysis</a>
273
      <ul class="dropdown-menu" role="menu">
274
        <li>
275
          <a href="roianalysis.html">ROI Analysis</a>
276
        </li>
277
        <li>
278
          <a href="spotanalysis.html">Cell/Spot Analysis</a>
279
        </li>
280
        <li>
281
          <a href="moleculeanalysis.html">Molecule Analysis</a>
282
        </li>
283
        <li>
284
          <a href="pixelanalysis.html">Pixels (Image Only) Analysis</a>
285
        </li>
286
      </ul>
287
    </li>
288
    <li class="dropdown-submenu">
289
      <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">Utilities</a>
290
      <ul class="dropdown-menu" role="menu">
291
        <li>
292
          <a href="interactive.html">Interactive Utilities</a>
293
        </li>
294
        <li>
295
          <a href="importingdata.html">Importing Spatial Data</a>
296
        </li>
297
        <li>
298
          <a href="voltronobjects.html">Working with VoltRon Objects</a>
299
        </li>
300
        <li>
301
          <a href="conversion.html">Converting VoltRon Objects</a>
302
        </li>
303
        <li>
304
          <a href="ondisk.html">OnDisk-based Analysis Utilities</a>
305
        </li>
306
      </ul>
307
    </li>
308
  </ul>
309
</li>
310
      </ul>
311
      <ul class="nav navbar-nav navbar-right">
312
        <li class="dropdown">
313
  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
314
    <span class="fa fa-envelope-o"></span>
315
     
316
    Contact
317
     
318
    <span class="caret"></span>
319
  </a>
320
  <ul class="dropdown-menu" role="menu">
321
    <li>
322
      <a href="https://bioinformatics.mdc-berlin.de">Altuna Lab/BIMSB Bioinfo</a>
323
    </li>
324
    <li>
325
      <a href="https://www.mdc-berlin.de/landthaler">Landthaler Lab/BIMSB</a>
326
    </li>
327
  </ul>
328
</li>
329
<li class="dropdown">
330
  <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
331
    <span class="fa fa-github"></span>
332
     
333
    GitHub
334
     
335
    <span class="caret"></span>
336
  </a>
337
  <ul class="dropdown-menu" role="menu">
338
    <li>
339
      <a href="https://github.com/BIMSBbioinfo/VoltRon">VoltRon</a>
340
    </li>
341
    <li>
342
      <a href="https://github.com/BIMSBbioinfo">BIMSB Bioinfo</a>
343
    </li>
344
  </ul>
345
</li>
346
      </ul>
347
    </div><!--/.nav-collapse -->
348
  </div><!--/.container -->
349
</div><!--/.navbar -->
350
351
<div id="header">
352
353
354
355
<h1 class="title toc-ignore">Tutorials</h1>
356
357
</div>
358
359
360
<style>
361
.title{
362
  display: none;
363
}
364
body {
365
  text-align: justify
366
}
367
table, th, td, tr{
368
  empty-cells:hide;
369
  border-spacing: 25px;
370
  border-collapse: separate;
371
}
372
td{
373
  filter:drop-shadow(0 0 10px rgba(0,0,0,0.3));
374
  padding: 10px;
375
  background:white;
376
  text-align:center;
377
  width:33%;
378
  vertical-align: text-top;
379
}
380
td:hover, td:active{
381
  filter:drop-shadow(0 0 10px rgba(0,0,0,0.3));
382
  transform: scale(1.02);
383
  cursor: pointer;
384
}
385
.main-container {
386
  max-width: 1200px;
387
  margin-left: auto;
388
  margin-right: auto;
389
}
390
<!-- .main-container { -->
391
<!--   margin-left: %5; -->
392
<!--   margin-right: auto; -->
393
<!-- } -->
394
p.tutorial {
395
  text-decoration: none!important;
396
  font-size: 1.5em;
397
  color: #23803A;
398
  margin: 3%
399
}
400
</style>
401
<p><br> <!-- <br> --></p>
402
<!-- ## Spatial Data Analysis with VoltRon -->
403
<p><br></p>
404
<div id="spatially-aware-data-integration-and-analysis"
405
class="section level2">
406
<h2>Spatially Aware Data Integration and Analysis</h2>
407
<p><strong>VoltRon</strong> incorporates multiple <strong>data
408
integration utilities to achieve data transfer</strong> across a diverse
409
set of spatial data modalities and types. VoltRon utilizes OpenCV to
410
align and synchronize spatial omic datasets using <strong>computer
411
vision and image registration</strong>. Users can automaticaly or
412
manually align a list of microscopy images (<strong>H&amp;E</strong>,
413
<strong>DAPI</strong> etc) using a <strong>Shiny App</strong>
414
incorporated within our analysis workflow. Once aligned, feature data
415
and metadata level information can be transfered across aligned tissue
416
sections.</p>
417
<p>In addition, VoltRon provides a number of spatially aware data
418
analysis methods to detecting niches (i.e. <strong>Niche
419
Clustering</strong>) within tissues. VoltRon allows estimating niches
420
associated with each cell by incorporating the cell type level
421
information around each cell or spot. We either detect cellular
422
populations/compositions within a spatial neighborhood of a cell to
423
create these niche level information (e.g. Xenium) or we estimate the
424
cell type abundances of spots (e.g. Visium, DBIT-Seq) from a reference
425
single cell data (Seurat, SingleCellExperiment etc.) with already
426
annotated cell types. VoltRon can also use these spatial neighborhood to
427
detect hot spots (i.e. <strong>Hot Spot Analysis</strong>) of features,
428
cell types and even molecular densities.</p>
429
<div>
430
<table>
431
<tbody>
432
<tr>
433
<td onclick="location.href=&#39;registration.html&#39;;">
434
<p class="tutorial">
435
Spatial Data Alignment
436
</p>
437
<div style="margin: 5%">
438
<img src="https://bimsbstatic.mdc-berlin.de/landthaler/VoltRon/Package/images/registration.png" class="center">
439
</div>
440
<p style="margin-top: 3%">
441
Automated and manual alignment of spatial data assays
442
</p>
443
</td>
444
<td onclick="location.href=&#39;multiomic.html&#39;;">
445
<p class="tutorial">
446
Multi-omic Integration
447
</p>
448
<div style="margin: 5%">
449
<img src="https://bimsbstatic.mdc-berlin.de/landthaler/VoltRon/Package/images/multiomic.png" class="center">
450
</div>
451
<p style="margin-top: 8%">
452
Integrating data modalities within or across tissue sections
453
</p>
454
</td>
455
<td onclick="location.href=&#39;nicheclustering.html&#39;;">
456
<p class="tutorial">
457
Niche Clustering
458
</p>
459
<div style="margin: 5%">
460
<img src="https://bimsbstatic.mdc-berlin.de/landthaler/VoltRon/Package/images/deconvolution.png" class="center">
461
</div>
462
<p style="margin-top: 10%">
463
Clustering based on ROI/spot deconvolution and Spatial Neighborhood
464
</p>
465
</td>
466
</tr>
467
</tbody>
468
</table>
469
</div>
470
<p><br> <br></p>
471
</div>
472
<div id="additional-downstream-analysis" class="section level2">
473
<h2>Additional Downstream Analysis</h2>
474
<p><strong>VoltRon</strong> is also capable of end-to-end analysis of
475
diverse set of spatial data types (or spatial entities)such as
476
<strong>ROIs</strong> (regions of interest), <strong>spots</strong>,
477
<strong>single cells</strong>, <strong>molecules</strong> and even
478
<strong>images</strong>. Users can set any data type as default at any
479
time where VoltRon provides minimal set of functions to analyze, process
480
and visualize each of these modalities.</p>
481
<table>
482
<tbody>
483
<tr>
484
<td onclick="location.href=&#39;roianalysis.html&#39;;">
485
<p class="tutorial">
486
Region of Interests (ROIs)
487
</p>
488
<div style="margin: 5%">
489
<img src="https://bimsbstatic.mdc-berlin.de/landthaler/VoltRon/Package/images/GeoMx.png" class="center">
490
</div>
491
<p style="margin-top: 7%">
492
Quality control, analysis and visualization of ROI segments
493
</p>
494
</td>
495
<td onclick="location.href=&#39;spotanalysis.html&#39;;">
496
<p class="tutorial">
497
Cells/Spots
498
</p>
499
<div style="margin: 5%">
500
<img  src="https://bimsbstatic.mdc-berlin.de/landthaler/VoltRon/Package/images/spotanalysis.png" class="center">
501
</div>
502
<p style="margin-top: 3%">
503
Quality control, analysis and visualization of Cell/Spot datasets
504
</p>
505
</td>
506
<td onclick="location.href=&#39;moleculeanalysis.html&#39;;">
507
<p class="tutorial">
508
Molecules
509
</p>
510
<br>
511
<div style="margin: 5%">
512
<img  src="https://bimsbstatic.mdc-berlin.de/landthaler/VoltRon/Package/images/molecule_visualize.png" class="center">
513
</div>
514
<p style="margin-top: 10%">
515
Analysis and visualization of Molecule datasets <br> <strong> (Under
516
Development) </strong>
517
</p>
518
</td>
519
</tr>
520
<tr>
521
<td onclick="location.href=&#39;pixelanalysis.html&#39;;">
522
<p class="tutorial">
523
Pixels (Image Only)
524
</p>
525
<div style="margin: 5%">
526
<img src="https://bimsbstatic.mdc-berlin.de/landthaler/VoltRon/Package/images/tissue_lowres_image_grid.png" class="center">
527
</div>
528
<p style="margin-top: 3%">
529
Analysis and visualization of Image datasets <br> <strong> (Under
530
Development) </strong>
531
</p>
532
</td>
533
<td>
534
</td>
535
<td>
536
</td>
537
</tr>
538
</tbody>
539
</table>
540
<p><br> <br></p>
541
</div>
542
<div id="other-utilities" class="section level2">
543
<h2>Other Utilities</h2>
544
<p>Here, we provide a group of tutorials to use additional features of
545
the VoltRon objects as well as further information on how to use
546
VoltRon. We describe a collection of features that VoltRon package
547
utilizes such as <strong>interactive annotation/visualization</strong>
548
and importing spatially aware data from <strong>diverse spatial omic
549
technologies</strong>. VoltRon is able to convert its objects to a
550
diverse set of objects/datatypes commonly incorporated spatial data
551
analysis (<strong>Seurat</strong>, <strong>SpatialExperiment</strong>,
552
<strong>Giotto</strong>, <strong>AnnData</strong> etc.). Large VoltRon
553
objects can be <strong>saved ondisk</strong> and efficiently analyzed
554
without straining memory.</p>
555
<table>
556
<tbody>
557
<tr>
558
<td onclick="location.href=&#39;interactive.html&#39;;">
559
<p class="tutorial">
560
Interactive Utilities
561
</p>
562
<br>
563
<div style="margin: 5%">
564
<img src="https://bimsbstatic.mdc-berlin.de/landthaler/VoltRon/Package/images/interactiveannotation.png" class="center">
565
</div>
566
<p style="margin-top: 8%">
567
Interactive annotation and visualization
568
</p>
569
</td>
570
<td onclick="location.href=&#39;voltronobjects.html&#39;;">
571
<p class="tutorial">
572
Working with VoltRon Objects
573
</p>
574
<br>
575
<div style="margin: 5%">
576
<img src="https://bimsbstatic.mdc-berlin.de/landthaler/VoltRon/Package/images/voltronobjects.png" class="center">
577
</div>
578
<br> <br>
579
<p style="margin-top: 6%">
580
Manipulating and configuring VoltRon objects
581
</p>
582
</td>
583
<td onclick="location.href=&#39;importingdata.html&#39;;">
584
<p class="tutorial">
585
Importing Spatial Data
586
</p>
587
<div style="margin: 10%">
588
<img src="https://bimsbstatic.mdc-berlin.de/landthaler/VoltRon/Package/images/technologies.png" class="center">
589
</div>
590
<p style="margin-top: -3%">
591
Importing readouts of spatial technologies
592
</p>
593
</td>
594
</tr>
595
<tr>
596
<td onclick="location.href=&#39;conversion.html&#39;;">
597
<p class="tutorial">
598
Converting VoltRon Objects
599
</p>
600
<br>
601
<div style="margin: 5%">
602
<img src="https://bimsbstatic.mdc-berlin.de/landthaler/VoltRon/Package/images/conversion.png" class="center">
603
</div>
604
<p style="margin-top: 9%">
605
Converting VoltRon objects into Seurat, SpatialExperiment and Squidpy
606
(anndata) etc.
607
</p>
608
</td>
609
<td onclick="location.href=&#39;ondisk.html&#39;;">
610
<p class="tutorial">
611
OnDisk Analysis Utilities
612
</p>
613
<div style="margin: 5%">
614
<img src="https://bimsbstatic.mdc-berlin.de/landthaler/VoltRon/Package/images/ondisk.png" class="center">
615
</div>
616
<p style="margin: 5%">
617
Efficient access to large VoltRon objects
618
</p>
619
</td>
620
</tr>
621
</tbody>
622
</table>
623
<p><br></p>
624
</div>
625
626
627
628
629
</div>
630
631
<script>
632
633
// add bootstrap table styles to pandoc tables
634
function bootstrapStylePandocTables() {
635
  $('tr.odd').parent('tbody').parent('table').addClass('table table-condensed');
636
}
637
$(document).ready(function () {
638
  bootstrapStylePandocTables();
639
});
640
641
642
</script>
643
644
<!-- tabsets -->
645
646
<script>
647
$(document).ready(function () {
648
  window.buildTabsets("TOC");
649
});
650
651
$(document).ready(function () {
652
  $('.tabset-dropdown > .nav-tabs > li').click(function () {
653
    $(this).parent().toggleClass('nav-tabs-open');
654
  });
655
});
656
</script>
657
658
<!-- code folding -->
659
660
661
<!-- dynamically load mathjax for compatibility with self-contained -->
662
<script>
663
  (function () {
664
    var script = document.createElement("script");
665
    script.type = "text/javascript";
666
    script.src  = "https://mathjax.rstudio.com/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML";
667
    document.getElementsByTagName("head")[0].appendChild(script);
668
  })();
669
</script>
670
671
</body>
672
</html>