Skip to content

Instantly share code, notes, and snippets.

@andrewxhill

andrewxhill/index.html

Last active May 27, 2016 17:05
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/1ae46fdab2a0e966412f to your computer and use it in GitHub Desktop.
Save andrewxhill/1ae46fdab2a0e966412f to your computer and use it in GitHub Desktop.
Download ZIP
Simple createLayer
Raw
index.html
<!doctype html>
<html>
<head>
<title>createLayer</title>
<link href='http://fonts.googleapis.com/css?family=Alike' rel='stylesheet' type='text/css'>
<style>
html, body, #map {
height: 100%;
padding: 0;
margin: 0;
background: black;
}
</style>
<link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/themes/css/cartodb.css" />
<script src="http://libs.cartocdn.com/cartodb.js/v3/cartodb.js"></script>
<script type="text/javascript">
function main() {
var layer = L.tileLayer('http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png', {
attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors, &copy; <a href="http://cartodb.com/attributions">CartoDB</a>'
});
var map = L.map('map', {
scrollWheelZoom: false,
center: [40.7127837, -74.0059413],
zoom: 6
});
map.addLayer(layer);
var bounds = [[-42, -126],[58, 154]];
map.fitBounds(bounds);
cartodb.createLayer(map, {
user_name: 'andrew',
type: 'cartodb',
sublayers: [{
sql: 'SELECT * FROM smart_center',
cartocss: '#smart_center{ marker-fill-opacity: 0.9; marker-line-color: #FFF; marker-line-width: 1; marker-line-opacity: 1; marker-placement: point; marker-type: ellipse; marker-width: 10; marker-fill: #FF6600; marker-allow-overlap: true;}'
}]
}).done(function(layer) {
map.addLayer(layer);
});
}
window.onload = main;
</script>
</head>
<body>
<div id="map"></div>
<canvas id="test" style="background-color: black;"></canvas>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment