PostGIS to include AK and HI in CartoDB

This example demonstrates the use of PostGIS to move and scale Alaska and Hawaii to fit SW off the continental US in a traditional map layout, client-side using CartoDB.js.

The continental US is first transformed out of Geo Web Mercator to an USA Contiguous Albers Equal Area Conic projection using the PostGIS function ST_Transform. Inspired by Free Your Maps From Web Mercator.

Alaska and Hawaii are then transformed using their respective projections, and then moved using St_Transform. Alaska's area is also reduced in size using the ST_Scale function.

<!DOCTYPE html>
<html>
  <head>
    <title>Including Alaska &amp; Hawaii</title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <link rel="shortcut icon" href="https://cartodb.com/assets/favicon.ico" />

</script>

var map = new L.Map("map", {
        center: [-1,-4],  // adjust the center a bit. we're reprojecting to meters, so not lat/lon here
        zoom: 4
    });

// create the layer source objects
    var counties = {
        user_name: 'rgdonohue',
        type: 'cartodb',
        sublayers: [{
                sql: "SELECT ST_Transform(the_geom, 102003) AS the_geom_webmercator FROM us_counties_ms_30 WHERE statefp != '02' and statefp != '15' and statefp != '72'",
                cartocss: $("#county-styles").text()
            }]
    },
    alaskaCounties = {
        user_name: 'rgdonohue',
        type: 'cartodb',
        sublayers: [{
                sql: "SELECT ST_Scale(ST_Translate(ST_Transform(the_geom, 102006),-3563330,-3083900),.7,.7) AS the_geom_webmercator FROM us_counties_ms_30 WHERE statefp = '02'",
                cartocss: $("#county-styles").text()
        }]
    },
    hawaiiCounties = {
        user_name: 'rgdonohue',
        type: 'cartodb',
        sublayers: [{
                sql: "SELECT ST_Scale(ST_Translate(ST_Transform(the_geom, 102007),-1600000,-1700000),1,1) AS the_geom_webmercator FROM us_counties_ms_30 WHERE statefp = '15'",
                cartocss: $("#county-styles").text()
        }]
    }

// store the objects 
    var layers = [counties, alaskaCounties, hawaiiCounties];

// loop through and mug those puppies to the map
    layers.forEach(function(layer){
        cartodb.createLayer(map, layer)
            .addTo(map);
    })

</script>

</body>
</html>

Modified http://libs.cartocdn.com/cartodb.js/v3/3.15/cartodb.js to a secure url

https://libs.cartocdn.com/cartodb.js/v3/3.15/cartodb.js