Skip to content

Instantly share code, notes, and snippets.

@cayetanobv
Created October 12, 2016 07:07
Show Gist options
  • Save cayetanobv/6d49fbaacede23a578a28246a4c3271b to your computer and use it in GitHub Desktop.
Save cayetanobv/6d49fbaacede23a578a28246a4c3271b to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<title>Torque Named Map | CartoDB</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="https://cartodb-libs.global.ssl.fastly.net/cartodb.js/v3/3.15/themes/css/cartodb.css" />
</head>
<body>
<div id="map"></div>
<!-- include cartodb.js library -->
<script src="https://cartodb-libs.global.ssl.fastly.net/cartodb.js/v3/3.15/cartodb.js"></script>
<!-- Drop your code between the script tags below! -->
<script>
var map;
function main() {
// create leaflet map
map = L.map('map', {
scrollWheelZoom: true,
center: [40.51792,-3.65280],
zoomControl: true,
zoom:14
});
// add a base layer
// L.tileLayer('http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png', {
L.tileLayer('http://tile.stamen.com/toner-lite/{z}/{x}/{y}.png', {
// L.tileLayer('http://tile.stamen.com/toner/{z}/{x}/{y}.png', {
// L.tileLayer('http://tile.stamen.com/terrain/{z}/{x}/{y}.png', {
attribution: 'Stamen'
}).addTo(map);
// add cartodb layer with one sublayer
// cartodb.createLayer(map, {
// user_name: 'my_namedmap_name',
// type: 'torque',
// order: 1,
// options: {
// // query: "",
// user_name: "my_namedmap_name",
// tile_style: 'Map{-torque-frame-count:10;-torque-animation-duration:1;-torque-time-attribute:"t";-torque-aggregation-function:"CDB_Math_Mode(torque_category)";-torque-resolution:1;-torque-data-aggregation:linear;}#alert{comp-op:xor;marker-fill-opacity:0.9;marker-line-color:#FFF;marker-line-width:0;marker-line-opacity:1;marker-type:ellipse;marker-width:9;marker-fill:#00ff00;}#alert[value=2]{marker-fill:#ff3300;}#alert[value=1]{marker-fill:#ff9900;}#alert[frame-offset=1]{marker-width:10;marker-fill-opacity:0.20;}#alert[frame-offset=2]{marker-width:12;marker-fill-opacity:0.18;}#alert[frame-offset=3]{marker-width:14;marker-fill-opacity:0.17;}#alert[frame-offset=4]{marker-width:16;marker-fill-opacity:0.15;}#alert[frame-offset=5]{marker-width:18;marker-fill-opacity:0.13;}#alert[frame-offset=6]{marker-width:20;marker-fill-opacity:0.11;}#alert[frame-offset=7]{marker-width:22;marker-fill-opacity:0.09;}#alert[frame-offset=8]{marker-width:24;marker-fill-opacity:0.07;}#alert[frame-offset=9]{marker-width:26;marker-fill-opacity:0.05;}#alert[frame-offset=10]{marker-width:28;marker-fill-opacity:0.03;}'
// },
// named_map: {
// name: "waste_issue",
// layers: [{
// layer_name: "t"
// }]
// }
// },{https:true,time_slider: false})
// .addTo(map)
// .done(function(layer) {
// layer.setZIndex(1);
// });
cartodb.createLayer(map, {
user_name: 'myusername',
type: 'namedmap',
named_map: {
name: "mynamedmap_name",
layers: [{
layer_name: "t1",
interactivity: "cartodb_id"
}]
}
},{ https: true}).addTo(map)
.done(function(layer) {
layer.setZIndex(2);
// layer.setParams({
// scope: 'myscope',
// start_date: "2016-05-01",
// start_date: "2016-09-01",
// //alert: 0
// })
});
}
window.onload = main;
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment