<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>
<meta charset="utf-8">
<title>
Home
- TimeMapper - Make Timelines and TimeMaps fast!
- from the Open Knowledge Foundation Labs
</title>
<meta content="TimeMapper - Make Timelines and TimeMaps fast! - from the Open Knowledge Foundation Labs" name="description">
<!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
<!--[if lt IE 9]>
<script src="https://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- offline use -->
<!--
<link href="/vendor/bootstrap/2.2.2/bootstrap.css" rel="stylesheet">
<link href="/vendor/bootstrap/2.2.2/bootstrap-responsive.css" rel="stylesheet">
-->
<link href="https://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet">
<link href="https://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
<link href="https://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.css" rel="stylesheet">
<!-- okf ribbon -->
<link href="https://assets.okfn.org/themes/okfn/okf-panel.css" rel="stylesheet">
<!-- Custom CSS for the TimeMapper Online App -->
<link href="/css/style.css" rel="stylesheet">
<script data-domain="timemapper.okfnlabs.org" defer="" src="https://plausible.io/js/plausible.js">
</script>
</head>
<body class="home">
<div class="collapse" id="okf-panel">
<iframe src="https://assets.okfn.org/themes/okfn/okf-panel.html">
</iframe>
</div>
<div class="okfn-ribbon">
<a data-target="#okf-panel" data-toggle="collapse" href="https://okfnlabs.org/" target="_blank">
An Open Knowledge Foundation Labs Project
</a>
</div>
<div class="navbar">
<div class="navbar-inner">
<div class="container">
<div class="brand">
<a class="black" href="/">
Time
<span class="brand-ext">
Mapper
</span>
</a>
from
<a class="by" href="https://okfnlabs.org/">
Open Knowledge Foundation Labs
</a>
</div>
<ul class="nav">
</ul>
<ul class="nav pull-right">
<li class="divider-vertical">
</li>
<li>
<a href="https://discuss.okfn.org/c/open-knowledge-labs/timemapper">
Contact Us
</a>
</li>
<li class="divider-vertical">
</li>
<li>
<a href="https://github.com/okfn/timemapper">
Report an Issue
</a>
</li>
<li class="divider-vertical">
</li>
<li>
<a class="logout" href="/account/login" title="sign in">
<i class="fa fa-sign-in">
</i>
Login
</a>
</li>
</ul>
</div>
</div>
</div>
<div class="container">
<div class="content">
<div class="hero-unit">
<h1>
Time
<span class="brand-ext">
Mapper
</span>
<small>
Elegant timelines and maps created in seconds
</small>
</h1>
<br>
<p>
<a class="btn btn-large btn-primary" href="/create">
It's free and easy to use –
Get started now »
</a>
</p>
</div>
<div class="">
<h2 style="text-align: center;">
Watch the 1 minute Tutorial
</h2>
<iframe allowfullscreen="" frameborder="0" height="360" src="https://www.youtube.com/embed/lCpilatN9yE?rel=0" style="display: block; margin: auto;" width="480">
</iframe>
<div>
<div class="examples row">
<div class="span12">
<h2 style="text-align: center;">
Examples
</h2>
</div>
<div class="span4">
<h4>
<a href="/anon/0s5rzt-major-battles-in-the-napoleonic-wars">
Battles in the Napoleonic Wars
</a>
</h4>
<a href="/anon/0s5rzt-major-battles-in-the-napoleonic-wars">
<img alt="" src="https://upload.wikimedia.org/wikipedia/commons/thumb/8/8b/Charles_Th%C3%A9venin_-_Reddition_de_la_ville_d%27Ulm.jpg/320px-Charles_Th%C3%A9venin_-_Reddition_de_la_ville_d%27Ulm.jpg">
</a>
</div>
<div class="span4">
<h4>
<a href="/okfn/medieval-philosophers">
Medieval Philosophers
</a>
</h4>
<a href="/okfn/medieval-philosophers">
<img alt="Medieval Philosophers" src="https://farm6.staticflickr.com/5323/8768093210_3343870b2a_n.jpg">
</a>
</div>
<div class="span4">
<h4>
<a href="https://timemapper.okfnlabs.org/adamrabinowitz/archaeowinetimeliner">
Archaeology of Wine
</a>
</h4>
<a href="https://timemapper.okfnlabs.org/adamrabinowitz/archaeowinetimeliner">
<img alt="" src="https://upload.wikimedia.org/wikipedia/commons/thumb/9/91/Hippone_Mosa%C3%AFque_romaine_les_Amours_vendangeurs.jpg/320px-Hippone_Mosa%C3%AFque_romaine_les_Amours_vendangeurs.jpg?uselang=en-gb">
</a>
</div>
</div>
<h2 style="text-align: center; margin: 30px;">
How It Works
</h2>
<div class="row instructions">
<div class="span4">
<div class="well">
<h3>
1. Create a Spreadsheet
</h3>
<p>
Add your dates and places to a Google Spreadsheet.
</p>
</div>
</div>
<div class="span4">
<div class="well">
<h3>
2. Connect and Customize
</h3>
<p>
Connect your spreadsheet with TimeMapper and customize the results.
</p>
</div>
</div>
<div class="span4">
<div class="well">
<h3>
3. Publish, Embed and Share
</h3>
<p>
Publish your TimeMap at your own personal url, then share or embed on your site.
</p>
</div>
</div>
</div>
<h2 id="credits" style="text-align: center; margin: 30px 0;">
Credits
</h2>
<p style="width: 500px; margin: auto;">
TimeMapper is an open-source project of
<a href="https://okfnlabs.org/">
Open Knowledge Foundation Labs
</a>
. It is possible thanks to a set of awesome open-source components including
<a href="http://timeline.verite.co/">
TimelineJS
</a>
,
<a href="https://okfnlabs.org/recline/">
ReclineJS
</a>
,
<a href="https://leafletjs.com/">
Leaflet
</a>
,
<a href="https://backbonejs.org/">
Backbone
</a>
and
<a href="https://twitter.github.com/bootstrap/">
Bootstrap
</a>
. You can find the
<a href="https://github.com/okfn/timemapper">
full open-source source for TimeMapper on GitHub here
</a>
.
</p>
</div>
</div>
</div>
<!-- /content -->
</div>
<!-- / container-fluid -->
<div class="footer">
<div class="container">
The
<a href="https://timemapper.okfnlabs.org/">
<strong>
TimeMapper
</strong>
</a>
is a project of
<a href="https://okfnlabs.org/">
Open Knowledge Foundation Labs
</a>
–
<a href="https://okfnlabs.org/contact/">
Contact Us
</a>
.
TimeMapper is open-source
–
<a href="https://github.com/okfn/timeliner">
Source Code
</a>
–
<a href="https://okfn.org/privacy-policy/">
Privacy policy
</a>
–
<a href="https://github.com/okfn/timeliner#copyright-and-license">
Copyright & License
</a>
.
</div>
</div>
<script src="/vendor/recline/vendor/jquery/1.7.1/jquery.js" type="text/javascript">
</script>
<script src="/vendor/recline/vendor/underscore/1.4.4/underscore.js" type="text/javascript">
</script>
<script src="https://assets.okfn.org/themes/okfn/collapse.min.js" type="text/javascript">
</script>
<script src="https://assets.okfn.org/themes/okfn/okf-panel.js" type="text/javascript">
</script>
<script type="text/javascript">
var TM = TM || {
};
TM.locals = {
currentUser: ""
};
</script>
</body>
</html>