Carl V. Lewis carlvlewis

directed-graph-creator

Interactive tool for creating directed graphs, created using d3.js.

Operation:

drag/scroll to translate/zoom the graph

This example shows how it is possible to use crossfilter bar charts (up to any number) to visually subset a choropleth. The map above shows the population and per-capita income growth of the US from 2011-2012.

	<!DOCTYPE html>
	<meta charset="utf-8"> <!-- also save this file as unicode-8 ! -->
	<head>
	<link rel="stylesheet" type="text/css" href="http://www.ankerst.de/lib/sankeySeqExplorer_10.css">

	<!--script src="../../../lib/d3_v4_2_1/d3.js"></script-->
	<script src="http://d3js.org/d3.v4.min.js"></script>
	<script src="http://www.ankerst.de/lib/sankeySeqExplorer_10.min.js"></script>
	<script src="http://www.ankerst.de/lib/sankeySeq_10.min.js"></script>
	<style>

	{
	"vars": {
	"@gray-base": "#373737",
	"@gray-darker": "lighten(@gray-base, 13.5%)",
	"@gray-dark": "lighten(@gray-base, 20%)",
	"@gray": "lighten(@gray-base, 33.5%)",
	"@gray-light": "lighten(@gray-base, 46.7%)",
	"@gray-lighter": "lighten(@gray-base, 93.5%)",
	"@brand-primary": "#984ac1",
	"@brand-success": "#5cb85c",

	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
	<title>Stripe Getting Started Form</title>

	<!-- The required Stripe lib -->
	<script type="text/javascript" src="https://js.stripe.com/v2/"></script>

	<!-- jQuery is used only for this example; it isn't required to use Stripe -->

	// Use Gists to store code you would like to remember later on
	console.log(window); // log the "window" object to the console