Raul Ochoa rochoa

modified version of http://bl.ocks.org/curran/01aa2685f083b6c1b9fb with the map's bounding box on the globe

original readme follows:

--

Pan and zoom in the map on the left to rotate the globe.

Click and drag the globe to pan on the map.

CartoDB's MVT service + Mapbox GL

Check index.html for some examples. These use a beta feature of CartoDB's Maps API: fixed URLs. So there is no need to use cartodb.js and tiles can be consumed using a named map name.

cartodb.js example

Check cartodb.js.html to see the integration with cartodb.js and in particular with cartodb.core.js.

Mapbox GL resources

API reference

Color ramps: *-fill

Basic usage

marker-fill: ramp([column_name], colorbrewer(Greens));
                  |                    |
                  v                    |
      column to calculate ramp         |
                                       v

	<!DOCTYPE html>
	<html>
	<head>
	<title>CartoDB: CartoCSS example – background-image</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%;

	<!DOCTYPE html>
	<html>
	<head>
	<title>CartoDB: CartoCSS example – background-color</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%;

	<!DOCTYPE html>
	<html>
	<head>
	<title>CartoDB: CartoCSS example – polygon-pattern-comp-op</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%;

	<!DOCTYPE html>
	<html>
	<head>
	<title>CartoDB: CartoCSS example – polygon-simplify</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%;

	<!DOCTYPE html>
	<html>
	<head>
	<title>CartoDB: CartoCSS example – line-simplify</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%;

 // Following code was extracted from almost-equal
 // (c) 2013 Mikola Lysenko. MIT License
 // MIT License (MIT)
 // See https://github.com/scijs/almost-equal/blob/93af191fe4075ee2dea94d29a26c796c26bb9cb6/almost_equal.js
 var PRECISION_FLOAT_EPSILON = 1.19209290e-7;
 var PRECISION_DOUBLE_EPSILON = 2.2204460492503131e-16;
 function almostEqual(a, b, absoluteError, relativeError) {
     absoluteError = absoluteError || PRECISION_DOUBLE_EPSILON;

	CREATE OR REPLACE FUNCTION public.CDB_Delayed_TableMetadata_Trigger()
	RETURNS trigger AS $$
	DECLARE upd timestamp;
	BEGIN
	IF TG_RELID = 'cartodb.CDB_TableMetadata'::regclass::oid THEN
	RETURN NULL;
	END IF;
	SELECT updated_at INTO upd
	FROM cartodb.CDB_TableMetadata WHERE tabname = TG_RELID::regclass;
	IF upd IS NOT NULL AND (now() - upd) > '20m'::interval THEN