Skip to content

Instantly share code, notes, and snippets.

<!DOCTYPE html>
<html lang="en">
<head>
<title>One Minute Map</title>
<meta charset="utf-8">
<link rel="stylesheet" href="https://mapzen.com/js/mapzen.css">
<script src="https://mapzen.com/js/mapzen.min.js"></script>
<style>
#map {
height: 100%;
@And-How
And-How / index.html
Last active August 29, 2015 14:17
index.html
<!DOCTYPE html>
<meta charset="utf-8">
<!-- affinity group data, circle rotation, auto-resize svg image, chord function, configuration -->
<title>Open Chord Example</title>
<style>
#visual {
font: 14px sans-serif;
}

This example uses the D3 chord layout function to show the links between different environmental websites.

I repurposed (stole) this code from Bob Baxley, I'm not that smart.

@And-How
And-How / Readme.md
Last active August 29, 2015 14:14 — forked from StewartNoyce/Readme.md

This example uses the D3 chord layout function to show the links between different environmental websites.

The chord layout implements the concept of circular visualization introduced in Circos.

Notable features include: responsive image resizing, chord layout rotation, and a generalized chord visualization function with configuration object.

Thanks to Stewart Noyce for the template!

<!DOCTYPE html>
<meta charset="utf-8">
<style>
body {
font: 10px sans-serif;
}
.chord path {
fill-opacity: .67;
@And-How
And-How / README.md
Last active August 29, 2015 14:14 — forked from mbostock/.block

Chord diagrams show directed relationships among a group of entities. This example also demonstrates simple interactivity by using mouseover filtering. Layout inspired by Martin Krzywinski's beautiful work on Circos.

@And-How
And-How / index.html
Created May 23, 2014 21:08
trying leaflet slider public
<!DOCTYPE html>
<html>
<head>
<title>Leaflet Time Slider Example</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.css" />
@And-How
And-How / index.html
Last active December 29, 2015 22:29 — forked from anonymous/gist:7736482
CouncilMembers
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title></title>
<script src='http://api.tiles.mapbox.com/mapbox.js/v1.4.0/mapbox.uncompressed.js'></script>
<link href='http://api.tiles.mapbox.com/mapbox.js/v1.4.0/mapbox.css' rel='stylesheet' />
<!--[if lte IE 8]>
<link href='//api.tiles.mapbox.com/mapbox.js/v1.4.0/mapbox.ie.css' rel='stylesheet'>
<![endif]-->
@And-How
And-How / index.html
Last active December 25, 2015 05:09
Oakland Voting
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title></title>
<script src='http://api.tiles.mapbox.com/mapbox.js/v1.4.0/mapbox.uncompressed.js'></script>
<link href='http://api.tiles.mapbox.com/mapbox.js/v1.4.0/mapbox.css' rel='stylesheet' />
<!--[if lte IE 8]>
<link href='//api.tiles.mapbox.com/mapbox.js/v1.4.0/mapbox.ie.css' rel='stylesheet'>
<![endif]-->
@And-How
And-How / index.html
Created October 10, 2013 16:56
testing vogb's layers control tilemill plugin
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<link rel="stylesheet"
href="http://cdn.leafletjs.com/leaflet-0.5.1/leaflet.css"/>
<link rel="stylesheet"
href="http://cdn.leafletjs.com/leaflet-0.5.1/leaflet.ie.css"/>
<style>
#map {