Commit 9522a9d4 authored by Narcon Nicolas's avatar Narcon Nicolas
Browse files

PRES: init the presentation + illustrations

parent 782c32a2
No related merge requests found
Pipeline #38500 failed with stage
in 52 seconds
Showing with 5518 additions and 0 deletions
+5518 -0
slides/illustrations/background.png

94.6 KB

slides/illustrations/cons.png

9.75 KB

File added
slides/illustrations/pansharpening_schema.png

383 KB

slides/illustrations/pros.png

10.8 KB

This source diff could not be displayed because it is too large. You can view the blob instead.
0.37447819905134883
0
0
-0.37447819905134883
1050376.56651895772665739
6773059.05526090040802956
slides/illustrations/src/pan.png

98.1 KB

This source diff could not be displayed because it is too large. You can view the blob instead.
0.37447819905134883
0
0
-0.37447819905134883
1050376.56651895772665739
6773059.05526090040802956
slides/illustrations/src/pxs.png

152 KB

0.37447819905134883
0
0
-0.37447819905134883
1050376.56651895772665739
6773059.05526090040802956
slides/illustrations/src/xs.png

19.2 KB

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<title>pyotb: A pythonic extension of Orfeo Toolbox</title>
<link rel="stylesheet" href="./revealjs/dist/reset.css">
<link rel="stylesheet" href="./revealjs/dist/reveal.css">
<link rel="stylesheet" href="./revealjs/dist/theme/white.css">
<link rel="stylesheet" href="otb.css" id="theme">
<link rel="stylesheet" href="block.css" id="slblock">
<!-- Theme used for syntax highlighted code -->
<link rel="stylesheet" href="a11y-light.css">
<!-- Theme used for drawer code -->
<link rel="stylesheet" href="./revealdrawer/dist/drawer.css" />
</head>
<body>
<div class="reveal">
<div class="slides">
<!-- I/ PREMIERE PAGE -->
<section data-background-image='illustrations/background.png'>
<h1>pyotb: A pythonic extension of Orfeo Toolbox</h1>
</br>
<p>Nicolas Narçon<sup>1</sup>, Rémi Cresson<sup>1</sup>, Vincent Delbar<sup>2</sup></p>
<p>(1) INRAE, (2) La TeleScop</p>
<br>
<p> Firenze, FOSS4G - 25 Aug. 2022</p>
</section>
<section data-background-image='illustrations/background.png'>
<h3>Basic satellite image processing in Python</h3>
<h4>Example: Pansharpening</h4>
<figure>
<img src="illustrations/pansharpening_schema.png" width=60%/>
</figure>
</section>
<!-- II/ PANSHARPENING WITH PYOTB -->
<section>
<section data-background-image='illustrations/background.png'>
<h2>What a developer goes trough</h2>
<video data-autoplay width=60% src="illustrations/pansharpening_google_search_final_speedup.mp4"></video>
</section>
<section data-background-image='illustrations/background.png'>
<h3>Issues</h3>
</br>
<img style='vertical-align:middle' src="illustrations/cons.png" width=5%/>
<span>Con n°1:</span>
</br></br>
<ul>
<li>Not many well-eshtablished Python Open Source remote sensing solutions -> trust?</li>
<li>Need to implement/adapt some algorithms -> loss of time</li>
</ul>
</br></br>
<br>
</section>
<section data-background-image='illustrations/background.png'>
<h2>Pansharpening in Python</h2>
<video data-autoplay width=60% src="illustrations/TODO"></video>
</section>
<section data-background-image='illustrations/background.png'>
<h3>Issues</h3>
</br>
<figure>
<img src="illustrations/cons.png" width=5%/>
<figcaption>Con n°2:</figcaption>
</figure>
<ul>
<li>Satellite image processing do not fit in RAM</li>
</ul>
<span>Solution: by hand tiling ?</span>
<pre><code data-trim class="python">
for i in range(0, size, chunk_size):
# Reading image
with rasterio.open('image.tif'):
...
</code></pre>
<br>
</section>
<section data-markdown>
<textarea data-template>
### Whatever
| Test | Test | Description |
| ---- | ---------- | ----------- |
| 1 | 0 | ssss |
</textarea>
</section>
</section>
<!-- III/ PANSHARPENING WITH PYOTB -->
<!-- III/ USECASE: EXAMPLE FROM THE DOC AVEC EXPORT RASTERIO -->
<!-- IV/ PERFORMANCE: ON A BIG SERVER IS IT SLOWER THAN FULL PYTHON ? -->
<section>
<h1>Thank you</h1>
<h3>Any questions?</h3>
</section>
</div>
</div>
<script src="./revealjs/dist/reveal.js"></script>
<script src="./revealjs/plugin/notes/notes.js"></script>
<script src="./revealjs/plugin/markdown/markdown.js"></script>
<script src="./revealjs/plugin/highlight/highlight.js"></script>
<script src="./revealdrawer/dist/drawer.js"></script>
<script>
// More info about initialization & config:
// - https://revealjs.com/initialization/
// - https://revealjs.com/config/
Reveal.initialize({
hash: true,
controlsLayout: 'edges',
// Visibility rule for backwards navigation arrows; "faded", "hidden"
// or "visible"
controlsBackArrows: 'visible',
slideNumber: true,
// Learn about plugins: https://revealjs.com/plugins/
plugins: [ RevealMarkdown, RevealHighlight, RevealNotes, RevealDrawer ],
// The "normal" size of the presentation, aspect ratio will
// be preserved when the presentation is scaled to fit different
// resolutions. Can be specified using percentage units.
width: 1920,
height: 1080,
// Factor of the display size that should remain empty around
// the content
margin: 0.01,
// Bounds for smallest/largest possible scale to apply to content
minScale: 0.2,
maxScale: 2.0,
drawer: {
colors: ["#fa1e0e", "#8ac926", "#1982c4", "#ffca3a"], // (optional) list of colors avaiable (hex color codes)
color: "#FF0000", // (optional) color of a cursor, first color from `codes` is a default
pathSize: 2, // (optional) path size in px, default 4
}
});
</script>
</body>
</html>
slides/otb.css 0 → 100644
/**
* Beige theme for tetis.js.
*
* Auteur: Remi Cresson
*
* Couleurs principales:
* 3bbcc8
* aaca38
* ef7e22
* Couleurs secondaires:
* e03926
* ec0a89
* eddb14
*/
@import url(../revealjs/dist/theme/fonts/league-gothic/league-gothic.css);
@import url(https://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic);
/*********************************************
* GLOBAL STYLES
*********************************************/
body {
background: #ffffff;
background-image: url('illustrations/background.png');
background-repeat: no-repeat;
background-position: bottom left;
background-size: auto 100%;
background-color: #ffffff;
}
h {
color: #3bbcc8;
font-weight: bold;
}
g {
color: #ef7e22;
font-weight: bold;
}
y {
color: #eddb14;
font-weight: bold;
}
.twocolumn {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 5px;
row-gap: 5px;
column-gap: 5px;
text-align: left;
}
.reveal {
font-family: "Lato", sans-serif;
font-size: 32px;
font-weight: normal;
color: #000000; }
::selection {
color: #000000;
background: rgba(79, 64, 28, 0.99);
text-shadow: none; }
::-moz-selection {
color: #000000;
background: rgba(79, 64, 28, 0.99);
text-shadow: none; }
.reveal .slides > section,
.reveal .slides > section > section {
data-background-image: url('illustrations/background.png');
line-height: 1.3;
font-weight: inherit; }
/*********************************************
* HEADERS
*********************************************/
.reveal h1,
.reveal h2,
.reveal h3 {
color: #000000;
font-family: Impact, sans-serif;},
.reveal h4 {
color: #000000;},
.reveal h5,
.reveal h6 {
margin: 0 0 20px 0;
color: #000000;
font-family: "League Gothic", Impact, sans-serif;
font-weight: normal;
line-height: 1.2;
letter-spacing: normal;
text-transform: uppercase;
text-shadow: none;
word-wrap: break-word; }
.reveal h1 {
font-size: 3.77em; }
.reveal h2 {
font-size: 2.11em; }
.reveal h3 {
font-size: 1.55em; }
.reveal h4 {
font-size: 1em; }
.reveal h1 {
text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.25), 0 20px 20px rgba(0, 0, 0, 0.15); }
/*********************************************
* OTHER
*********************************************/
.reveal p {
margin: 20px 0;
line-height: 1.3; }
/* Ensure certain elements are never larger than the slide itself */
.reveal img,
.reveal video,
.reveal iframe {
max-width: 95%;
max-height: 95%; }
.reveal strong,
.reveal b {
font-weight: bold; }
.reveal em {
font-style: italic; }
.reveal ol,
.reveal dl,
.reveal ul {
display: inline-block;
text-align: left;
margin: 0 0 0 1em; }
.reveal ol {
list-style-type: decimal; }
.reveal ul {
list-style-type: disc; }
.reveal ul ul {
list-style-type: square; }
.reveal ul ul ul {
list-style-type: circle; }
.reveal ul ul,
.reveal ul ol,
.reveal ol ol,
.reveal ol ul {
display: block;
margin-left: 40px; }
.reveal dt {
font-weight: bold; }
.reveal dd {
margin-left: 40px; }
.reveal q,
.reveal blockquote {
quotes: none; }
.reveal blockquote {
display: block;
position: relative;
width: 70%;
margin: 20px auto;
padding: 5px;
font-style: italic;
background: rgba(255, 255, 255, 0.05);
box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2); }
.reveal blockquote p:first-child,
.reveal blockquote p:last-child {
display: inline-block; }
.reveal q {
font-style: italic; }
.reveal pre {
display: block;
position: relative;
width: 90%;
margin: 20px auto;
text-align: left;
font-size: 0.55em;
font-family: monospace;
line-height: 1.2em;
word-wrap: break-word;
box-shadow: 0px 0px 6px rgba(0, 0, 0, 0.3); }
.reveal code {
font-family: monospace; }
.reveal pre code {
display: block;
font-size: 1.15em;
background: #FFFFFF;
padding: 5px;
overflow: auto;
max-height: 500px;
word-wrap: normal; }
.reveal table {
margin: auto;
border-collapse: collapse;
border-spacing: 0; }
.reveal table th {
font-weight: bold; }
.reveal table th,
.reveal table td {
text-align: left;
padding: 0.2em 0.5em 0.2em 0.5em;
border-bottom: 1px solid; }
.reveal table th[align="center"],
.reveal table td[align="center"] {
text-align: center; }
.reveal table th[align="right"],
.reveal table td[align="right"] {
text-align: right; }
.reveal table tbody tr:last-child th,
.reveal table tbody tr:last-child td {
border-bottom: none; }
.reveal sup {
vertical-align: super; }
.reveal sub {
vertical-align: sub; }
.reveal small {
display: inline-block;
font-size: 0.6em;
line-height: 1.2em;
vertical-align: top; }
.reveal small * {
vertical-align: top; }
/*********************************************
* LINKS
*********************************************/
.reveal a {
color: #3bbcc8;
text-decoration: none;
-webkit-transition: color .15s ease;
-moz-transition: color .15s ease;
transition: color .15s ease; }
.reveal a:hover {
color: #c0bc2b;
text-shadow: none;
border: none; }
.reveal .roll span:after {
color: #ffffff;
background: #cb254a; }
/*********************************************
* IMAGES
*********************************************/
.reveal section img {
margin: 15px 0px;
background: rgba(255, 255, 255, 0.12);
/*
border: 4px solid #333;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
*/
.reveal section img.plain {
border: 0;
box-shadow: none; }
.reveal a img {
-webkit-transition: all .15s linear;
-moz-transition: all .15s linear;
transition: all .15s linear; }
.reveal a:hover img {
background: rgba(255, 255, 255, 0.2);
border-color: #e03926;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); }
/*********************************************
* NAVIGATION CONTROLS
*********************************************/
.reveal .controls .navigate-left,
.reveal .controls .navigate-left.enabled {
border-right-color: #e03926; }
.reveal .controls .navigate-right,
.reveal .controls .navigate-right.enabled {
border-left-color: #e03926; }
.reveal .controls .navigate-up,
.reveal .controls .navigate-up.enabled {
border-bottom-color: #e03926; }
.reveal .controls .navigate-down,
.reveal .controls .navigate-down.enabled {
border-top-color: #e03926; }
.reveal .controls .navigate-left.enabled:hover {
border-right-color: #ec0a89; }
.reveal .controls .navigate-right.enabled:hover {
border-left-color: #ec0a89; }
.reveal .controls .navigate-up.enabled:hover {
border-bottom-color: #ec0a89; }
.reveal .controls .navigate-down.enabled:hover {
border-top-color: #ec0a89; }
/*********************************************
* PROGRESS BAR
*********************************************/
.reveal .progress {
background: rgba(0, 0, 0, 0.2); }
.reveal .progress span {
background: #e03926;
-webkit-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
-moz-transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985);
transition: width 800ms cubic-bezier(0.26, 0.86, 0.44, 0.985); }
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment