Skip to content

Instantly share code, notes, and snippets.

@andrewxhill
Last active August 29, 2015 14:02
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save andrewxhill/e6c1bf2f1b7c88e7999b to your computer and use it in GitHub Desktop.
Save andrewxhill/e6c1bf2f1b7c88e7999b to your computer and use it in GitHub Desktop.
Default map from tablename / username
<!DOCTYPE html>
<html>
<head>
<title>Easy 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%;
padding: 0;
margin: 0;
}
</style>
<link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/themes/css/cartodb.css" />
</head>
<body>
<div id="map"></div>
<!-- include cartodb.js library -->
<script src="http://libs.cartocdn.com/cartodb.js/v3/cartodb.uncompressed.js"></script>
<script src="viz.js"></script>
<script>
function main() {
cartodb.createVis('map',vizjson)
}
window.onload = main;
</script>
</body>
</html>
var vizjson = {
version: "0.1.0",
title: "dkan demo",
description: null,
map_provider: "leaflet",
bounds: [
[
-60,
-180
],
[
60,
180
]
],
layers: [
{
order: 0,
type: "tiled",
options: {
visible: true,
type: "Tiled",
urlTemplate: "http://{s}.tile.osm.org/{z}/{x}/{y}.png?",
name: "OSM",
attribution: "OSM"
},
},
{
type: "layergroup",
options: {
user_name: "andrew",
layer_definition: {
layers: [
{
type: "CartoDB",
tooltip: true,
order: 1,
options: {
sql: "select * from untitled_table_5",
layer_name: "untitled_table_5",
cartocss: "#untitled_table_5 { [mapnik-geometry-type=linestring]{ line-color: #F84F40; line-width: 3; line-opacity: 0.7; } [mapnik-geometry-type=polygon]{ polygon-fill: #F84F40; polygon-opacity: 0.7; line-color: #FFF; line-width: 1; line-opacity: 1; } [mapnik-geometry-type=point]{ marker-fill-opacity: 0.9; marker-line-color: #FFF; marker-line-width: 1.5; marker-line-opacity: 1; marker-placement: point; marker-type: ellipse; marker-width: 9; marker-fill: #F84F40; marker-allow-overlap: true; } }",
cartocss_version: "2.1.1",
interactivity: "cartodb_id"
}
}
]
}
}
}
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment