Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
branch: master
Fetching contributors…

Cannot retrieve contributors at this time

143 lines (128 sloc) 5.072 kb
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Dynamic San Francisco Geotagged Cameraphone Pics IV</title>
</head>
<body>
<div id="cm-example" style="width: 800px; height: 600px"></div>
<script type="text/javascript" src="http://tile.cloudmade.com/wml/latest/web-maps-lite.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript">//<![CDATA[
(function($){
$.ajaxSetup({
cache: false // turn off AJAX caching
});
var cacheObj = {};
var cloudmade = new CM.Tiles.CloudMade.Web({key: 'ccfc587e00ca40458db437d57437f5cf',styleId: 22405});
var map = new CM.Map('cm-example', cloudmade);
// set centre to be San Francisco Centroid from Flickr:
//http://www.flickr.com/places/info/2487956
map.setCenter(new CM.LatLng(37.7792,-122.4201), 13);
// disable all scrolling and dragging
map.disableDragging();
map.disableMouseZoom();
var bounds = map.getBounds();
var sw = bounds.getSouthWest();
var ne = bounds.getNorthEast();
var ne_lat = ne.lat();
var ne_lng = ne.lng();
var sw_lat = sw.lat();
var sw_lng = sw.lng();
var nw = new CM.LatLng(ne_lat,sw_lng);
var se = new CM.LatLng(sw_lat,ne_lng);
console.log("NE lat:"+ne.lat()+" long:"+ne.lng());
console.log("SW lat:"+sw.lat()+" long:"+sw.lng());
var first_polygon = new CM.Polygon([nw,ne,se,sw], "fuchsia", 5, 0.5);
var second_polygon = new CM.Polygon([nw,ne,se,sw], "darkorange", 5, 0.5);
function toggle_heartbeat_polygon(index) {
++index;
if (index % 2) {
map.removeOverlay(first_polygon);
map.addOverlay(second_polygon);
}
else {
map.removeOverlay(second_polygon);
map.addOverlay(first_polygon);
}
setTimeout(function () {toggle_heartbeat_polygon(index);},1000);
};
function toggle_polygon(index,polygons,circles) {
var current_index = (++index);
switch (current_index) {
case (1):
case (2):
case (3):
case (4):
map.removeOverlay(circles[current_index - 1]);
map.addOverlay(circles[current_index]);
break;
case (5):
map.removeOverlay(circles[current_index - 1]);
map.addOverlay(polygons[(current_index - 1) % 2]);
break;
default:
map.removeOverlay(polygons[current_index % 2]);
map.addOverlay(polygons[(current_index + 1) % 2]);
break;
}
setTimeout(function () {toggle_polygon(current_index,polygons,circles);},Math.floor(Math.random()*1000)+500);
};
function doGet() {
var d = new Date();
var now = Math.round(d.getTime() * 0.001);
var n_str = now + '';
var intervalToSearchForGeoTaggedPhotos = now - 1200; // 60 * 20 == 20 minutes ago
var intervalToSearchForGeoTaggedPhotos_str = intervalToSearchForGeoTaggedPhotos +'';
var apiKey = 'a3b9e1fec66dfb1797c7414dfbb81974';
var woeID = '2487956';
$.getJSON("http://api.flickr.com//services/rest/?method=flickr.photos.search"+
"&api_key="+apiKey+
"&format=json&content_type=1&woe_id="+woeID+
"&per_page=250&min_upload_date="+intervalToSearchForGeoTaggedPhotos_str+
"&extras=date_taken,geo,url_s"+
"&max_upload_date="+n_str+
"&page=1&sort=date-posted-desc&jsoncallback=?",
function(flickrjs){ //flickrjs is the JSON object from flickr
if (parseInt(flickrjs.photos.total) == 0) {
console.log("No San Francisco geotagged photos at:"+d.toLocaleString()
+" pages:"+flickrjs.photos.pages+" status:"+flickrjs.stat
);
}
else {
$.each(flickrjs.photos.photo,function(i,photo) {
var id = photo.id;
var lat = photo.latitude;
var lon = photo.longitude;
console.log("<a href=\"http://flickr.com/photos/"+photo.owner+
"/"+id+"/\"><img src=\""+photo.url_s+"\" /></a><p>Latitude:"+lat+" Longitude:"+lon+"</p>");
if (!cacheObj['id' + id]) {
console.log("photo:"+id+" not in cache");
var polygons = [];
polygons.push(new CM.Polygon([new CM.LatLng(lat,lon)], "red", 15, 0.5));
polygons.push(new CM.Polygon([new CM.LatLng(lat,lon)], "forestgreen", 15, 0.5));
var circles = [];
circles.push(new CM.Circle(new CM.LatLng(lat,lon), 30, "blue", 5, 0.1));
circles.push(new CM.Circle(new CM.LatLng(lat,lon), 25, "blue", 5, 0.2));
circles.push(new CM.Circle(new CM.LatLng(lat,lon), 22, "blue", 5, 0.3));
circles.push(new CM.Circle(new CM.LatLng(lat,lon), 19, "blue", 5, 0.4));
circles.push(new CM.Circle(new CM.LatLng(lat,lon), 15, "blue", 5, 0.5));
map.addOverlay(circles[0]);
cacheObj['id' + id] = true;
setTimeout(function () {toggle_polygon(0,polygons,circles);},Math.floor(Math.random()*1000)+500);
}
});
}
});
};
function doIt() {
$.when (doGet())
.done(function() {
setTimeout(doIt, 20000);
})
};
map.addOverlay(first_polygon);
setTimeout(function () {toggle_heartbeat_polygon(0);},1000);
setTimeout(doIt, 1000);
})(jQuery);
//]]></script>
</body>
Jump to Line
Something went wrong with that request. Please try again.