summaryrefslogtreecommitdiff
path: root/index.html
diff options
context:
space:
mode:
authorChristopher Baines <mail@cbaines.net>2015-05-06 21:31:56 +0100
committerChristopher Baines <mail@cbaines.net>2015-05-13 18:20:04 +0100
commitd72504c5ce791e06fb2427b3fc00a645a94ee5ab (patch)
treeea39536d54fe61bf0f9bd46e04493ef04d00ad22 /index.html
downloadosm-introductory-workshop-d72504c5ce791e06fb2427b3fc00a645a94ee5ab.tar
osm-introductory-workshop-d72504c5ce791e06fb2427b3fc00a645a94ee5ab.tar.gz
Initial commitHEADmaster
Diffstat (limited to 'index.html')
-rw-r--r--index.html346
1 files changed, 346 insertions, 0 deletions
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..84a97f8
--- /dev/null
+++ b/index.html
@@ -0,0 +1,346 @@
+<!doctype html>
+<html lang="en">
+ <head>
+ <meta charset="utf-8">
+
+ <title>Introduction to OpenStreetMap and the
+ Humanitarian OpenStreetMap Team
+ </title>
+
+ <meta name="description" content="Slides for a workshop introducing
+ OpenStreetMap and the Humanitarian OpenStreetMap Team">
+ <meta name="author" content="Christopher Baines">
+
+ <meta name="apple-mobile-web-app-capable" content="yes" />
+ <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
+
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
+
+ <link rel="stylesheet" href="reveal.js/css/reveal.css">
+ <link id="theme" href="reveal.js/css/theme/white.css" rel="stylesheet">
+
+ <!-- For syntax highlighting -->
+ <link rel="stylesheet" href="reveal.js/lib/css/zenburn.css">
+
+ <link rel="stylesheet" href="leaflet/dist/leaflet.css" />
+ <script src="leaflet/dist/leaflet-src.js"></script>
+
+ <style>
+ .reveal .standalone {
+ font-size: 0.2em;
+ }
+
+ .blur {
+ background: none repeat scroll 0 0 rgba(255, 255, 255, 0.35);
+ }
+
+ .dark-blur {
+ background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
+ }
+
+ .reveal h1 {
+ text-transform: none;
+ }
+ .reveal h2 {
+ text-transform: none;
+ }
+ .reveal h3 {
+ text-transform: none;
+ }
+ </style>
+
+ <!--[if lt IE 9]>
+ <script src="lib/js/html5shiv.js"></script>
+ <![endif]-->
+ </head>
+
+ <body>
+
+ <div class="reveal">
+
+ <!-- Any section element inside of this container is displayed as a slide -->
+ <div class="slides">
+ <section data-background="images/background.png">
+ <h4 style="font-weight: 900;">Introduction to</h4>
+ <h2 style="text-transform: none; font-weight: 900;">OpenStreetMap</h2>
+ <a href="http://wiki.openstreetmap.org/wiki/File:Public-images-osm_logo.svg">
+ <img src="images/Public-images-osm_logo.svg"
+ style="border: 0px solid #333; box-shadow: 0 0 0px rgba(0, 0, 0, 0); background: none repeat scroll 0 0 rgba(255, 255, 255, 0);";/>
+ </a>
+ <p>
+ <small style="font-weight: 900;">By <a href="http://cbaines.net/">Christopher Baines</a></small>
+ </p>
+ </section>
+
+ <section>
+ <h2>This workshop will cover</h2>
+ <ul>
+ <li>What OpenStreetMap is</li>
+ <li>Ways to use OpenStreetMap</li>
+ <li>How to contribute to OpenStreetMap</li>
+ </ul>
+ </section>
+
+ <section>
+ <h1>What is OpenStreetMap</h1>
+
+ <h2>Find out at
+ <a target="_blank" href="https://openstreetmap.org/">OpenStreetMap.org</a>
+ </h2>
+ <small>This part consists of a tour of the basic functionality
+ offered at openstreetmap.org</small>
+ </section>
+
+ <section>
+ <h2>How can you use OpenStreetMap</h2>
+ </section>
+
+ <section>
+ <h2>You may have already used OpenStreetMap</h2>
+
+ <ul>
+ <li>
+ <a target="_blank" href="http://www.kfc.co.uk/find-us/">
+ KFC
+ </a>
+ </li>
+ <li>
+ Craigslist
+ </li>
+ <li>
+ <a target="_blank"
+ href="https://foursquare.com/explore?mode=url&near=Southampton">
+ FourSquare
+ </a>
+ </li>
+ </ul>
+ </section>
+
+ <section>
+ <h3>An OpenStreetMap Map</h3>
+
+ <p>One option is the map on OpenStreetMap.org
+ <iframe style="width: 20%; float: left;" src="demo1.html">
+ </iframe>
+ </p>
+
+ <p style="clear: left;">
+ <img src="images/osmand.png" style="float: right; width: 30%;" />
+ Other applications like <a href="http://osmand.net/">OSMAND</a> provide offline maps for Android,
+ and iOS devices
+ </p>
+
+ </section>
+
+ <!-- https://www.flickr.com/photos/small_realm/11189803153/ -->
+ <section data-background-color="#000000" data-background="images/data-center.jpg">
+ <h1 class="blur" style="text-transform: none; font-weight: 900; text-shadow:
+ -5px 0 black, 0 5px black, 5px 0 black, 0 -5px black;">OpenStreetMap
+ is a dataset</h1>
+ <!--
+ <a href="https://openclipart.org/detail/49411/binary-file">
+ <img src="images/Binary-File-Plain.svg" style="width: 60%; border: 0px solid #000; box-shadow: 0 0 0px rgba(0, 0, 0, 0.15)"/>
+ </a>
+ -->
+
+ </section>
+
+ <section>
+ <h3>Changing OpenStreetMap</h3>
+
+ <p>
+ To change what you see, you need to edit the underlying data.
+ </p>
+
+ <span class="fragment">
+ <p>
+ To change the data, you need to use an <b>editor</b>.
+ </p>
+ </span>
+
+ <span class="fragment">
+ <p>
+ There are several editors, this workshop covers iD and JOSM.
+ </p>
+ </span>
+ </section>
+
+ <section>
+ <h2>OpenStreetMap.org</h2>
+
+ <p>Editing OpenStreetMap requires an account.</p>
+
+ <p>If you have an OpenID account (Google, Yahoo and Wordpress all
+ provide this feature), you can use this for authentication.</p>
+ </section>
+
+ <section data-background="images/id-screenshot.png"
+ data-background-color="#000000">
+ <div class="dark-blur">
+ <h3>The iD Editor</h3>
+
+ <!--
+ <a href="https://github.com/openstreetmap/iD/blob/master/svg/logo.svg">
+ <img src="images/id-logo.svg"
+ style="border: 0px solid #333; box-shadow: 0 0 0px rgba(0, 0, 0, 0); background: none repeat scroll 0 0 rgba(255, 255, 255, 0);";/>
+ </a>
+ -->
+
+ <p>
+ Use on
+ <a href="https://www.openstreetmap.org/" target="_blank">
+ openstreetmap.org
+ </a>
+ </p>
+ </div>
+ </section>
+
+ <section>
+ <h3>At this point, you should have:</h3>
+ <ul>
+ <li>An OpenStreetMap account</li>
+ <li>The ability to add buildings to the map with JOSM</li>
+ </ul>
+
+ <br>
+ <br>
+ <h3>If not, the following resources might help:</h3>
+ <ul>
+ <li>
+ <a href="http://learnosm.org/en/beginner/start-osm/#create-an-openstreetmap-account">
+ LearnOSM Beginner's Guide
+ </a>
+ <li>
+ <a href="http://mapgive.state.gov/learn-to-map/">
+ MapGive Learn to Map (with videos)
+ </a>
+ </li>
+ </ul>
+ </section>
+
+ <section data-background="images/josm-screenshot.png"
+ data-background-color="#000000">
+ <div class="dark-blur">
+ <a href="http://wiki.openstreetmap.org/wiki/File:JOSM_Logo_2014.svg">
+ <img src="images/JOSM_Logo_2014.svg"
+ style="width: 200px; border: 0px solid #333; box-shadow: 0 0 0px rgba(0, 0, 0, 0); background: none repeat scroll 0 0 rgba(255, 255, 255, 0);";/>
+ </a>
+ <h2>JOSM</h2>
+
+ <p>
+ Another popular editor is JOSM, it is an extensible editor for OpenStreetMap.
+ </p>
+
+ <p>
+ It is more complicated than iD, and does not work from a web
+ browser.
+ </p>
+
+ <p>
+ However, JOSM can be faster to use than iD, and has more
+ capabilities (mutiple data layers, filters, ...).
+ </p>
+ </div>
+ </section>
+
+ <section>
+ <h2>Installing JOSM</h2>
+
+ <p>
+ If you are using
+ <a href="https://packages.debian.org/sid/josm">Debian</a>,
+ <a href="http://packages.ubuntu.com/utopic/josm">Ubuntu</a>,
+ <a href="https://apps.fedoraproject.org/packages/josm">Fedora</a>,
+ <a href="https://www.archlinux.org/packages/community/any/josm/">Arch</a>
+ or probably other other free software operating systems, you should
+ just be able to install JOSM using their package manager.
+ </p>
+
+ <p>
+ For other operating systems, including (Microsoft Windows, and Mac
+ OS X), see the
+ <a href="https://josm.openstreetmap.de/">JOSM homepage</a>
+ </p>
+ </section>
+
+ <section>
+ <h2>Legal Details</h2>
+
+ <p>
+ <b>You</b> hold the copyright for the data which you add to OpenStreetMap.
+ </p>
+
+ <p>
+ OpenStreetMap is licenced under the<br>
+ <a href="http://opendatacommons.org/licenses/odbl/summary/">Open
+ Database License (ODbL).</a>
+ </p>
+ </section>
+
+ <section>
+ <a href="http://opendatacommons.org/licenses/odbl/summary/">
+ Open Database License (ODbL) Summary
+ </a>
+
+ <h3>You are free:</h3>
+ <ul>
+ <li>To <b>Share</b> the database</li>
+ <li>To <b>Create</b> works from the database</li>
+ <li>To <b>Adapt</b> the database</li>
+ </ul>
+
+ <h3>As long as you:</h3>
+ <ul>
+ <li><b>Attribute</b> any public use of the database.</li>
+
+ <li><b>Share-Alike</b>, you must offer derived works and adapted
+ databases under the ODbL.</li>
+
+ <li><b>Keep open</b>, you must distribute the database without
+ technical restrictions.</li>
+ </ul>
+ </section>
+
+ <section>
+ <h2>Other Resources</h2>
+
+ <ul>
+ <li>
+ <a href="http://learnosm.org/en/beginner/start-osm/#create-an-openstreetmap-account">
+ LearnOSM Beginner's Guide
+ </a>
+ <li>
+ <a href="http://mapgive.state.gov/learn-to-map/">
+ MapGive Learn to Map (with videos)
+ </a>
+ </li>
+ </ul>
+ </section>
+
+ </div>
+ </div>
+
+ <script src="reveal.js/lib/js/head.min.js"></script>
+ <script src="reveal.js/js/reveal.js"></script>
+
+ <script>
+
+ // Full list of configuration options available here:
+ // https://github.com/hakimel/reveal.js#configuration
+ Reveal.initialize({
+ controls: false,
+ progress: true,
+ history: true,
+ center: true,
+ touch:true,
+
+ transition: 'linear',
+ dependencies: [
+ { src: 'reveal.js/plugin/notes/notes.js', async: true },
+ ]
+ });
+
+ </script>
+
+ </body>
+</html>
generated by cgit v1.2.3 (git 2.45.0) at 2024-12-03 19:20:42 +0000