Skip to content

Instantly share code, notes, and snippets.

@nerik

nerik/..generator-test

Last active February 22, 2016 10:50
Download ZIP
generator-test - Another awesome CartoDB viz !
Raw
..generator-test
Another awesome CartoDB viz !
Raw
.eslintrc
{
"env": {
"browser": true,
"node": false,
},
"rules": {
"quotes": [2, "single"],
}
}
Raw
.gitignore
node_modules/
*.log
.DS_Store
Raw
index.css
html, body, #container {
height: 100%;
width: 100%;
overflow: hidden;
}
body {
padding-top: 50px;
}
#map {
width: auto;
height: 100%;
box-shadow: 0 0 10px rgba(0,0,0,0.55);
}
#sidebar {
width: 300px;
height: 100%;
max-width: 100%;
float: left;
-webkit-transition: all 0.25s ease-out;
-moz-transition: all 0.25s ease-out;
transition: all 0.25s ease-out;
}
.navbar .navbar-brand {
font-weight: bold;
font-size: 25px;
color: #FFFFFF;
}
.navbar {
background-image: linear-gradient(to bottom, #2b6988 0%, #1f4b61 100%);
}
.navbar-inverse .navbar-nav>li>a {
color: #fff;
}
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head profile="http://www.w3.org/2005/10/profile">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="">
<meta name="author" content="">
<title>CartoDB Bootstrap Starter Template</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/3.15/themes/css/cartodb.css" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link rel="stylesheet" href="index.css" media="screen">
<link rel="shortcut icon" href="favicon.ico" />
<script src="//localhost:9091"></script>
</head>
<body>
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container-fluid">
<div class="navbar-header">
<div class="navbar-icon-container">
<a href="#" class="navbar-icon pull-right visible-xs" id="nav-btn"><i class="fa fa-bars fa-lg white"></i></a>
<a href="#" class="navbar-icon pull-right visible-xs" id="sidebar-toggle-btn"><i class="fa fa-search fa-lg white"></i></a>
</div>
<a class="navbar-brand" href="#">CartoDB Template</a>
</div>
<div class="navbar-collapse collapse">
<form class="navbar-form navbar-right" role="search">
<div class="form-group has-feedback">
<span class="twitter-typeahead" style="position: static; display: block; direction: ltr;"><input id="searchbox" type="text" placeholder="Search" class="form-control tt-input" autocomplete="off" spellcheck="false" dir="auto" style="position: relative; vertical-align: top;"><pre aria-hidden="true" style="position: absolute; visibility: hidden; white-space: pre; font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; font-style: normal; font-variant: normal; font-weight: 400; word-spacing: 0px; letter-spacing: 0px; text-indent: 0px; text-rendering: auto; text-transform: none;"></pre><span class="tt-dropdown-menu" style="position: absolute; top: 100%; left: 0px; z-index: 100; display: none; right: auto;"><div class="tt-dataset-Boroughs"></div><div class="tt-dataset-Theaters"></div><div class="tt-dataset-Museums"></div><div class="tt-dataset-GeoNames"></div></span></span>
<span id="searchicon" class="fa fa-search form-control-feedback"></span>
</div>
</form>
<ul class="nav navbar-nav">
<li><a href="#" data-toggle="collapse" data-target=".navbar-collapse.in" id="about-btn"><i class="fa fa-question-circle white"></i>&nbsp;&nbsp;About</a></li>
<li class="dropdown">
<a id="toolsDrop" href="#" role="button" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false"><i class="fa fa-globe white"></i>&nbsp;&nbsp;Tools <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#" data-toggle="collapse" data-target=".navbar-collapse.in" id="full-extent-btn"><i class="fa fa-arrows-alt"></i>&nbsp;&nbsp;Zoom To Full Extent</a></li>
<li><a href="#" data-toggle="collapse" data-target=".navbar-collapse.in" id="legend-btn"><i class="fa fa-picture-o"></i>&nbsp;&nbsp;Show Legend</a></li>
<li class="divider hidden-xs"></li>
<li><a href="#" data-toggle="collapse" data-target=".navbar-collapse.in" id="login-btn"><i class="fa fa-user"></i>&nbsp;&nbsp;Login</a></li>
</ul>
</li>
<li class="dropdown">
<a class="dropdown-toggle" id="downloadDrop" href="#" role="button" data-toggle="dropdown" aria-expanded="false"><i class="fa fa-cloud-download white"></i>&nbsp;&nbsp;Download <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="data/boroughs.geojson" download="boroughs.geojson" target="_blank" data-toggle="collapse" data-target=".navbar-collapse.in"><i class="fa fa-download"></i>&nbsp;&nbsp;Boroughs</a></li>
<li><a href="data/subways.geojson" download="subways.geojson" target="_blank" data-toggle="collapse" data-target=".navbar-collapse.in"><i class="fa fa-download"></i>&nbsp;&nbsp;Subway Lines</a></li>
<li><a href="data/DOITT_THEATER_01_13SEPT2010.geojson" download="theaters.geojson" target="_blank" data-toggle="collapse" data-target=".navbar-collapse.in"><i class="fa fa-download"></i>&nbsp;&nbsp;Theaters</a></li>
<li><a href="data/DOITT_MUSEUM_01_13SEPT2010.geojson" download="museums.geojson" target="_blank" data-toggle="collapse" data-target=".navbar-collapse.in"><i class="fa fa-download"></i>&nbsp;&nbsp;Museums</a></li>
</ul>
</li>
<li class="hidden-xs"><a href="#" data-toggle="collapse" data-target=".navbar-collapse.in" id="list-btn"><i class="fa fa-list white"></i>&nbsp;&nbsp;POI List</a></li>
</ul>
</div><!--/.navbar-collapse -->
</div>
</div>
<div id="container">
<div id="sidebar">
</div>
<div id="map">
</div>
</div><!-- /.container -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="http://libs.cartocdn.com/cartodb.js/v3/3.15/cartodb.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script type="text/javascript" src="index.js"></script>
</body>
</html>
Raw
index.js
var map = new L.Map('map', {
center: [40.1,-100.3],
zoom: 4
});
L.tileLayer('http://{s}.basemaps.cartocdn.com/dark_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>'
}).addTo(map);
var layerUrl = 'http://documentation.cartodb.com/api/v2/viz/236085de-ea08-11e2-958c-5404a6a683d5/viz.json';
cartodb.createLayer(map, layerUrl)
.addTo(map)
.on('done', function(layer) {
}).on('error', function() {
//log the error
});
Raw
package.json
{
"name": "generator-test",
"version": "0.0.1",
"description": "Another awesome CartoDB viz !",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "true ",
"livereload": "live-reload --port 9091 .",
"open": "opener http://localhost:9090",
"serve": "http-server -s -p 9090 .",
"dev": "npm run build -s && (sleep 1 && npm run open -s) & npm run livereload -s & npm run serve",
"gist": "echo 'Another awesome CartoDB viz !' > '..generator-test' && gistup && gistup-rename 'generator-test - Another awesome CartoDB viz !'"
},
"repository": {
"type": "git",
"url": "git+https://github.com/nerik/generator-cartodb.git"
},
"keywords": [
"cartodb"
],
"author": "nerik",
"license": "ISC",
"bugs": {
"url": "https://github.com/nerik/generator-cartodb/issues"
},
"homepage": "https://github.com/nerik/generator-cartodb#readme",
"devDependencies": {
"http-server": "^0.8.5",
"live-reload": "^1.1.0",
"opener": "^1.4.1",
"gistup": "^0.1.2",
"eslint": "^2.0.0"
},
"dependencies": {
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment