Unterbahn

I’ve been banging my head against a wall for a few days on this one, first struggling with ImageMagick, then switching to gdal to get full-resolution geoTIFFs from Cartagen Knitter. I had a ‘duh’ moment just now when I realized that gdalwarp can only do polynomial or thin plate spline warps, neither of which are what I want – that is, perspectival warping. I want to map 4 corner ground control points or GCPs to four latitude/longitude positions. Back to ImageMagick…

I know there are 5 GCPs in the image above – it was the same deal with just 4… it can’t do more than a shear unless you either add the minimum 6 GCPs for a single polynomial warp, or go for a thin plate spline (TPS) distort. A good way to think about TPS is as if the image were a sheet of thin metal (the reason it’s called a TPS) and that you’re bending it in the z-dimension, aplanar. This causes funny curved edges and is not what I’m looking for.

OK, one more note for future reference: see this page for a discussion of different warping techniques and also for the minimum number of GCPs required for different-order polynomial warps.

OpenStreetMap.org‘s RESTful API allows anyone to access data on their continually growing collaborative map of the world… in XML. This is great for most applications, but if you’re working in JavaScript (as we are), XML might as well be greek. We need JSON.

To offer OSM-JSON along with of OSM-XML, we added a route to accept a “.format” suffix, and split up the render call based on the params[:format] part of the route:

# /config/routes.rb:46-50

map.connect "api/#{API_VERSION}/geohash/:geohash.:format", :controller => 'api', :action => 'geohash'
map.connect "api/#{API_VERSION}/geohash/:geohash", :controller => 'api', :action => 'geohash'

map.connect "api/#{API_VERSION}/map.:format", :controller => 'api', :action => 'map'
map.connect "api/#{API_VERSION}/map", :controller => 'api', :action => 'map'

Notice we also added a ‘geohash’ route. Whereas the /map call requires a bbox parameter (‘bbox=min_lon,min_lat,max_lon,max_lat’), we can use a geohash (Geohash in JavaScript, Geohash in Rails) which defines a bounding box as a sequence of letters and numbers. This fits Cartagen’s needs well, and since it doesn’t require any parameters, we can page cache it in Rails. (Remember that page caching bypasses Rails entirely, letting Apache handle these cached files at high speed – that saved us when we were on BoingBoing).

Read the rest of this entry »

We know we just released Cartagen 0.5 a couple weeks ago, but after testing it extensively in the wild, we really wanted a fast, low-resource release so that users of netbooks, older computers, and older browsers could use Cartagen too.

So, as well as including some general cleanup, this version hums along on a variety of machines. Please send feedback on speed/load times/CPU usage, etc; we tested it on an 800mhz G4 iMac and while it wasn’t super responsive, it did load and was somewhat usable in Firefox 3.5. For reference, Hulu.com’s Flash player does not run on that machine. On more powerful machines (4x3ghz Intel Xeon, 2500×1600 monitor), it can load over 10,000 objects in the viewport without hiccuping. For most users, a typical browser window size yields a responsive and reasonably low-resource experience.

Download Cartagen 0.6.1 (We did 0.6 and just rushed directly into 0.6.1 before announcing.)

There’s definitely a lot more we can do to improve speed, but for now we feel good about our optimizations. We identified the high CPU usage as generally poor management of timers in JavaScript, and wrote a TimerManager class which adjusts its timer intervals automatically, easing the CPU load. We elected to maintain a relatively high CPU usage to keep things rendering smoothly, but users of TimerManager can ‘turn up the heat’ or turn down CPU usage by tweaking a ‘spacing’ parameter. We also broke more intense tasks up by creating a TaskManager class, which preserves UI responsiveness and framerate while staying in a single JavaScript thread. We plan to use the multithreaded, asynchronous Web Workers spec in HTML5 when available, but for now we wanted to work on older hardware/software.

We hope that TimerManager and TaskManager will be of use to others working with JavaScript animation and we’ll be packaging them up separately for download.

For now, look at http://code.google.org/p/cartagen for source and http://wiki.cartagen.org for update docs.

So this is an accurate (in terms of coordinates) map of London, generated from OpenStreetMap data:

You can pan around quite a bit and use the scroll wheel to zoom. To achieve this, I created the following geographic stylesheet:

http://unterbahn.com/cartagen/warcraft.gss

The map is built on Cartagen, a mapping framework for viewing and geographic data in a dynamic, personally relevant way. Cartagen uses the GSS (Geo Style Sheet) format, which allows users to design maps with CSS-like styles. Learn more at Cartagen.org and the Cartagen wiki, or download the source at Google Code.

Go to Cartagen.org to view anywhere in the world through this stylesheet.

Dabu!

Quick update: some users (read: most) are having trouble zooming in and out! This is because of a known last-minute bug in the 0.6 release of Cartagen, and only affects maps embedded in other pages. It does not affect cartagen.org. For a quick fix, to zoom you can also hold down the ‘z’ key and drag up and down on the map.
Followup update: zooming with the scroll wheel should work now. Thanks for your patience!

Today we’d like to announce the 0.5 release of the dynamic mapping framework Cartagen. In this release, we’ve taken a shot at rendering any location on the planet (drawing, of course, on data from OpenStreetMap), and at rendering a much greater density of map features with richer styles. The has come a long way, and we hope it makes designing your own map easier while allowing even greater possibilities for unique and compelling designs.

Download Cartagen 0.5

This is the first release we consider to be useable by the general public; as such we are releasing a video to demonstrate how to download Cartagen, get a data set, and write your own GSS stylesheet in just a few minutes:

More information and setup instructions are on Cartagen’s wiki, and our live demonstration site at cartagen.org has been updated.

Cartagen is still incomplete: it needs more optimization for slower browsers and devices like the iPhone and Android phones, it can make better use of HTML5 features such as Web Workers for multi-threaded JavaScript for a more responsive UI, and we hope to continue our early efforts to combine it usefully with OpenLayers and other mapping platforms.

Special thanks to Ben Weissmann who’s joined the Cartagen team and has been instrumental in bringing it this far.

For those of you trying to write Rails applications around a FrontlineSMS database in MySQL:

rails-frontlinesms.txt

Went to Wherecamp 2009 a day early by mistake… so I had time to add patterns, opacity, and iPhone multitouch to Cartagen before presenting. I love putting maps on a brown paper background…

Patterns, opacity, and viewport for Cartagen on Flickr.

Map of road condition in Cartagen on Flickr

Not many cities have good road condition data in OpenStreetMap, but it’s the perfect target for an SMS reporting system, since street names geocode so easily.

Take a look at http://cartagen.org – the buildings now have both hover and mouseDown styles. The syntax is:

building: {
	lineWidth: 0.001,
	fillStyle: "#444",
	hover: {
		fillStyle: '#222'
	},
	mouseDown: {
		lineWidth: 4,
		strokeStyle: "red"
	}
},