|
<!DOCTYPE html> |
|
<html> |
|
<head> |
|
<title>Including Alaska & 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="http://cartodb.com/assets/favicon.ico" /> |
|
|
|
<style> |
|
html, body, #map { |
|
height: 100%; |
|
padding: 0; |
|
margin: 0; |
|
} |
|
</style> |
|
|
|
<link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/3.15/themes/css/cartodb.css" /> |
|
</head> |
|
<body> |
|
|
|
<div id="map"></div> |
|
|
|
<script src="http://libs.cartocdn.com/cartodb.js/v3/3.15/cartodb.js"></script> |
|
|
|
<script type="cartocss/html" id="county-styles"> |
|
// store the CartoCSS style here b/c it's a pain to write below |
|
#us_counties_ms_30{ |
|
polygon-fill: #4A87B4; |
|
polygon-opacity: 0.7; |
|
line-color: #FFF; |
|
line-width: 0.5; |
|
line-opacity: 1; |
|
} |
|
|
|
</script> |
|
|
|
<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> |