Skip to content

Instantly share code, notes, and snippets.

@jhubley
jhubley / README.md
Last active August 29, 2015 14:12
vector tiles plus plotted coordinates

A map of some trees in Fort Greene Park, showing Mapbox vector tiles in the background, with tree coordinates plotted on top. Tree coordinates are loaded in with data(). Tree location data gathered by me. I used Mike Bostock's vector tile example as a starting point.

@jhubley
jhubley / README.md
Last active August 29, 2015 14:13
drawing points on a map with canvas

This is basically the same as my last block, except the circles are drawn using canvas instead of SVG. Helpful method for large datasets, to avoid performance issues. The data binding method here comes from this great article by Irene Ros.

@jhubley
jhubley / README.md
Created January 21, 2015 23:43
svg circles drawn for points maintain scale on zoom

This example shows the points, which represent coffee shops near my apartment, maintaining their scale as one zooms in and out. There are also tooltips on mouseover, using d3.tip.

@jhubley
jhubley / README.md
Last active August 29, 2015 14:16
zoomable tile map with multiple paths and points (Iditarod routes)

A map of Iditarod routes over the years. The routes are drawn using svg.line, and scale as you zoom. The dots have tooltips. Using vector tiles as a base.

@jhubley
jhubley / README.md
Last active August 29, 2015 14:16
time lapse of circles

Time lapse. Data is totally without meaning. There's not even a y axis. A basic template, needs to be cleaned up a bit.

@jhubley
jhubley / README.md
Last active August 29, 2015 14:17
relief of US plus boundary
@jhubley
jhubley / index.html
Last active August 29, 2015 14:17
waves
<!DOCTYPE html>
<html>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<body>
<script src="http://d3js.org/d3.v3.js"></script>
<script type="text/javascript">
svg = d3.select("body").append("svg")
var w = 2000,
@jhubley
jhubley / index.html
Last active August 29, 2015 14:17
NYC subway map
<!DOCTYPE html>
<meta charset="utf-8">
<style>
#boroughs {
stroke: none;
stroke-width: 0px;
fill: #ddd;
opacity:.9;
position:absolute;
Options All
Order deny,allow