-
Notifications
You must be signed in to change notification settings - Fork 11
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
9 changed files
with
1,018 additions
and
268 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,29 @@ | ||
.h2 OpenLayers Timeline | ||
|
||
OpenLayers Timeline is a simple library to create a time related map with OpenLayers. | ||
Currently it supports source data from GeoJSON or GeoRSS. | ||
|
||
See a demo at http://volpino.github.com/openlayers-timeline/ | ||
|
||
|
||
.h3 Deps | ||
|
||
* jQuery | ||
* jQuery-UI Slider | ||
|
||
|
||
.h3 Basic Usage | ||
|
||
* Include dependancies | ||
* create a OpenLayers Timeline object | ||
* initialize Timeline and enjoy! | ||
|
||
|
||
.h3 API Documentation | ||
|
||
Write me! | ||
|
||
|
||
.h3 Contribute! | ||
|
||
Feel free to fork, report bugs, send patches or suggestions :D |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,75 @@ | ||
<!DOCTYPE html> | ||
<html> | ||
<head> | ||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> | ||
<meta name="apple-mobile-web-app-capable" content="yes"> | ||
<link rel="stylesheet" href="css/ui-lightness/jquery-ui-1.8.13.custom.css" type="text/css" /> | ||
<link rel="stylesheet" href="http://openlayers.org/dev/theme/default/style.css" type="text/css" /> | ||
<link rel="stylesheet" href="css/style.css" type="text/css" /> | ||
<script src="lib/jquery-1.4.4.min.js" type="text/javascript"></script> | ||
<script src="lib/jquery-ui-1.8.14.custom.min.js" type="text/javascript"></script> | ||
<script src="http://openlayers.org/api/OpenLayers.js" type="text/javascript"></script> | ||
<script src="lib/OpenLayers.Format.GeoJSONTimeline.js" type="text/javascript"></script> | ||
<script src="timeline.js" type="text/javascript"></script> | ||
|
||
<script type="text/javascript"> | ||
var map, timeline; | ||
|
||
function init(){ | ||
map = new OpenLayers.Map('map'); | ||
layer = new OpenLayers.Layer.WMS( "OpenLayers WMS", | ||
"http://vmap0.tiles.osgeo.org/wms/vmap0", | ||
{layers: 'basic'}, {numZoomLevels: 5}); | ||
map.addLayer(layer); | ||
map.setCenter(new OpenLayers.LonLat(0, 0), 2); | ||
timeline = new OpenLayers.Timeline({map: map, | ||
timeline: "#timeline", | ||
date_key: "when", | ||
format: OpenLayers.Format.GeoJSONTimeline}); | ||
|
||
var url = "http://toolserver.org/~sonet/api_geojson.php?article=OpenLayers&callback=?"; | ||
$.getJSON(url, function(data) { | ||
$("#status").text("Data loaded"); | ||
timeline.initTimeline(data); | ||
}); | ||
} | ||
|
||
function toggleCumulative() { | ||
if ($("#cumulative").attr("checked")) { | ||
timeline.cumulative = true; | ||
} | ||
else { | ||
timeline.cumulative = false; | ||
} | ||
timeline.update(); | ||
} | ||
|
||
$(document).ready(function() { | ||
init(); | ||
timeline.cumulative = true; | ||
$("#cumulative").attr("checked", "checked"); | ||
}); | ||
</script> | ||
</head> | ||
<body> | ||
<h1 id="title">OpenLayers Timeline GeoJSON Demo</h1> | ||
<div id="container"> | ||
<p> | ||
The source of the data is <a href="http://toolserver.org/~sonet/api_geojson.php">Toolserver</a>. | ||
It represents anonymous edits on the OpenLayers Wikipedia page. | ||
</p> | ||
<p id="status">Loading...</p> | ||
<div id="controls"> | ||
<input type="button" onclick="timeline.togglePlay();" value="Play/Pause" /> | ||
<input type="button" onclick="timeline.fasterAnimation();" value="Faster" /> | ||
<input type="button" onclick="timeline.slowerAnimation();" value="Slower" /> | ||
<label for="cumulative">Cumulative</label> | ||
<input id="cumulative" type="checkbox" onChange="toggleCumulative();" /> | ||
</div> | ||
<div id="timeline"></div> | ||
<div id="map" class="smallmap"></div> | ||
</div> | ||
</body> | ||
</html> | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,130 @@ | ||
/** | ||
* Copyright (C) 2008, 2009 FBK Foundation, (http://www.fbk.eu) | ||
* Author: Federico Scrinzi @ SoNet Group | ||
* | ||
* OpenLayers-Timeline is free software: you can redistribute it and/or modify | ||
* it under the terms of the GNU Affero General Public License as published by | ||
* the Free Software Foundation version 3 of the License. | ||
*/ | ||
|
||
/** | ||
* Class: OpenLayers.Format.GeoJSONTimeline | ||
* This class represents a GeoJSON format with time support | ||
*/ | ||
OpenLayers.Format.GeoJSONTimeline = OpenLayers.Class(OpenLayers.Format.GeoJSON, { | ||
past_seconds: 0, | ||
date_key: "when", | ||
first: undefined, | ||
lowerlimit: undefined, | ||
timestamp_funct: undefined, | ||
|
||
read: function(json, type, filter) { | ||
type = (type) ? type : "FeatureCollection"; | ||
var results = null; | ||
var obj = null; | ||
if (typeof json == "string") { | ||
obj = OpenLayers.Format.JSON.prototype.read.apply(this, | ||
[json, filter]); | ||
} else { | ||
obj = json; | ||
} | ||
if(!obj) { | ||
OpenLayers.Console.error("Bad JSON: " + json); | ||
} else if(typeof(obj.type) != "string") { | ||
OpenLayers.Console.error("Bad GeoJSON - no type: " + json); | ||
} else if(this.isValidType(obj, type)) { | ||
switch(type) { | ||
case "Geometry": | ||
try { | ||
results = this.parseGeometry(obj); | ||
} catch(err) { | ||
OpenLayers.Console.error(err); | ||
} | ||
break; | ||
case "Feature": | ||
try { | ||
results = this.parseFeature(obj); | ||
results.type = "Feature"; | ||
} catch(err) { | ||
OpenLayers.Console.error(err); | ||
} | ||
break; | ||
case "FeatureCollection": | ||
// for type FeatureCollection, we allow input to be any type | ||
results = []; | ||
switch(obj.type) { | ||
case "Feature": | ||
try { | ||
var r = this.parseFeature(obj); | ||
if (r) { | ||
results.push(r); | ||
} | ||
} catch(err) { | ||
results = null; | ||
OpenLayers.Console.error(err); | ||
} | ||
break; | ||
case "FeatureCollection": | ||
for(var i=0, len=obj.features.length; i<len; ++i) { | ||
try { | ||
var r = this.parseFeature(obj.features[i]); | ||
if (r) { | ||
results.push(r); | ||
} | ||
} catch(err) { | ||
results = null; | ||
OpenLayers.Console.error(err); | ||
} | ||
} | ||
break; | ||
default: | ||
try { | ||
var geom = this.parseGeometry(obj); | ||
results.push(new OpenLayers.Feature.Vector(geom)); | ||
} catch(err) { | ||
results = null; | ||
OpenLayers.Console.error(err); | ||
} | ||
} | ||
break; | ||
} | ||
} | ||
return results; | ||
}, | ||
|
||
parseFeature: function(obj) { | ||
var feature, geometry, attributes, bbox, when; | ||
attributes = (obj.properties) ? obj.properties : {}; | ||
when = attributes[this.date_key]; | ||
if (this.timestamp_funct) { | ||
when = this.timestamp_funct(when); | ||
} | ||
if (when) { | ||
if (!this.first || this.first > when) { | ||
this.first = when; | ||
} | ||
if (when > this.past_seconds) { | ||
return; | ||
} | ||
if (this.lowerlimit && when < this.lowerlimit) { | ||
return; | ||
} | ||
} | ||
bbox = (obj.geometry && obj.geometry.bbox) || obj.bbox; | ||
try { | ||
geometry = this.parseGeometry(obj.geometry); | ||
} catch(err) { | ||
// deal with bad geometries | ||
throw err; | ||
} | ||
feature = new OpenLayers.Feature.Vector(geometry, attributes); | ||
if(bbox) { | ||
feature.bounds = OpenLayers.Bounds.fromArray(bbox); | ||
} | ||
if(obj.id) { | ||
feature.fid = obj.id; | ||
} | ||
return feature; | ||
}, | ||
CLASS_NAME: "OpenLayers.Format.GeoJSONTimeline" | ||
}); |
Oops, something went wrong.