Smathermather's Weblog

Remote Sensing, GIS, Ecology, and Oddball Techniques

Archive for the ‘CartoDB’ Category

Playing with new tools and old standards: GeoJSON, Leaflet, CartoDB across platforms

Posted by smathermather on February 16, 2012

Leaflet, CartoDB, GeoJSON, and cross platform web map deployment. First some introductions:

Leaflet is a modern, lightweight open-source JavaScript library for interactive maps for desktop and mobile web browsers, developed by CloudMade to form the core of its next generation JavaScript API. Weighting just about 21kb of gzipped JS code, it still has all the features you will ever need for you web mapping needs while providing a fast, smooth, pleasant user experience.”

Not a bad description. There’s more maturity and flexibility to OpenLayers, but still much fun to be had with Leaflet. And as both are Open Source and competing in similar markets, they inform each other, and it’s fun to watch the friendly rivalry between the communities developing the libraries.

In an earlier post, I demonstrated the use of Leaflet in conjunction with CartoDB. What’s cartodb? From their web site:

“CartoDB allows you to map data & develop location aware applications quickly and easily. With plans starting from free, take CartoDB for a test drive today!”

CartoDB is a really slick hosted service (cloud) implementation of PostGIS, similar in some respects to fusion tables functionality. Don’t like the cloud it’s hosted on, or the associated prices? Well, it’s open source, so you can put it on your private cloud too, or set up physical linux machine to host it.

Mix these two things with 3 hours of insomnia the other night, and you get this:

Nice cross platform implementation!  These are pure vector deployed maps– served through Leaflet from CartoDB as GeoJSON.  Here shown deployed to a Blackberry, iPhone, Android, and Kindle Fire (also Android), which a buddy and I pulled up as we sat in a bar tonight.  We also took a picture of this with a windows laptop also running the page for demonstrable non-webkit deployment, but this was the better (albeit fuzzy) picture.  Ah, the wonders of Open Standards.  Next time, we’ll see if we can get a Windows Mobile phone in there, along with Mac, Windows, and Linux desktops.

Still, for now GeoServer and OpenLayers are my babies for deploying GeoSpatial data, but there are a few different ways to deploy through Open Standards using Open Source software, and it’s fun to draw a little from the other geospatial tribes.

Posted in CartoDB, Database, Leaflet, PostGIS, PostgreSQL, Recreation, SQL, Trail Curation, Trails | Tagged: , , , , , , | 2 Comments »

CartoDB, Leaflet, and a little anti-generalization

Posted by smathermather on November 28, 2011

CartoDB is one of two hosted (read: cloud) PostGIS database implementations.  It has a maps API, an SQL API, and is some fun to use.  The other hosted PostGIS implementation is SpacialDB which has a Restful API, but can also take SQL.  I just got my key for the free version of that, so hopefully I will be reviewing use of that in the future too.

I can’t beat Bill Dollins’ post CartoDB + Leaflet = Easy, and I hadn’t played with Leaflet before, but am often up to my eyeballs in OpenLayers, so I thought I’d build off Bill’s post.  I haven’t, well, not substantially anyway.  But I did start to and found some strange behavior in displaying GeoJSON in Leaflet, under the right conditions anyway.  This is what I got:

Difference between properly displayed GeoJSON, and GeoJSON with missing point.

The green line shows the correct line, the dark gray line shows how it’s being displayed noticeably incorrectly by Leaflet.  I was about to post to the CartoDB website when I dug a little further:

The problem goes away as you zoom in...

The problem goes away as you zoom in…

and also as you zoom out...

and also as you zoom out… leading me to conclude it’s not a CartoDB issue, but a leaflet issue, as the GeoJSON geometry is not re-requested based on zoom level.  But is it a bug?  I suspect not.  I suspect it’s a feature– I suspect leaflet is auto-generalizing the geometry of the GeoJSON by dropping the occasional node.  Since we have so few nodes along the southern boundary, it matters here.  Maybe they should use a Douglas-Peucker or similar algorithm, but that may not be practical as it’s difficult to know a priori what the tolerance value should be (of course, the Leaflet user might know what value to use, however…).  I’ll post to the leaflet forum tomorrow to find out.  In the mean time, my fix is simple.  Instead of a simple load of the CartoDB geometries:,%20the_geom%20FROM%20boundary&format=geojson&callback=?

We’ll use the SQL API to complicate the geometry on the fly with ST_Segmentize, which will add extra nodes in anticipation of Leaflet simplifying it:,%20ST_Segmentize%28the_geom,%200.0001%29%20AS%20the_geom%20FROM%20boundary&format=geojson&callback=?

Yup.  It’s a hack.  I’ll have to find out if there are any alternative (less hackish) solutions.

BTW, rockin’ the CartoDB, but hate thinking in geographic to do segmentization.  In market fairness, I’ll try something similar with SpacialDB soon.

Posted in CartoDB, Database, Leaflet, PostGIS, PostgreSQL, SQL | Tagged: , , , , , , , | 5 Comments »