Skip to content

Instantly share code, notes, and snippets.

@javisantana
javisantana / index.html
Created September 5, 2013 15:34
custom infowindow requesting data form server
<!DOCTYPE html>
<html>
<head>
<title>Custom infowindow example | CartoDB.js</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%;
@javisantana
javisantana / api.md
Last active December 22, 2015 03:49
this is a small API documentation template for your projects

Library or whatever title

Here what the library can do for other people

dead simple code example

API definition

@javisantana
javisantana / index.html
Created September 2, 2013 08:47
bubble and chrolopleth legends example
<!DOCTYPE html>
<html>
<head>
<title>Leaflet multilayer example | CartoDB.js</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%;
@javisantana
javisantana / index.html
Last active February 17, 2016 10:15
bubble legend
<!DOCTYPE html>
<html>
<head>
<title>Leaflet multilayer example | CartoDB.js</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%;
@javisantana
javisantana / index.html
Created September 2, 2013 07:11
create a custom legend without CartoDB UI
<!DOCTYPE html>
<html>
<head>
<title>Leaflet multilayer example | CartoDB.js</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%;
@javisantana
javisantana / index.html
Created July 29, 2013 08:08
Cartodb.js example changing the cursor when hover on features
<!DOCTYPE html>
<html>
<head>
<title>Leaflet multilayer example | CartoDB.js</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%;
@javisantana
javisantana / index.html
Created July 18, 2013 14:33
social infowindow in cartodb
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<style>
html, body, #map {
height: 100%;
padding: 0;
function vec3(xx, yy, zz) {
this.x = xx || 0;
this.y = yy || 0;
this.z = zz || 0;
this.translate = function (d) { return new vec3(this.x+d[0], this.y+d[1],this.z+d[2]) }
this.scale = function(s) { return new vec3(s*this.x, s*this.y,s*this.z) }
this.rotz = function(ang) {
var c = Math.cos(ang)
var s = Math.sin(ang)
return new vec3(this.x*c - this.y*s,this.y*c + this.x*s, this.z)
<!DOCTYPE html>
<html>
<head>
<title>Leaflet multilayer example | CartoDB.js</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%;
cartodb.createLayer(map, 'viz.json').done(function(layer) {
map.addLayer(layer);
var countries = layer.getSubLayer(0);
countries.setSQL('select * from countries');
var places = layer.createSubLayer({
sql: "select * from populated_places",
cartocss: "#layer { marker-fill: red; }"
})