Skip to content

Instantly share code, notes, and snippets.

View plmrry's full-sized avatar
🦆
converting JSON to other JSON

Paul Murray plmrry

🦆
converting JSON to other JSON
32 followers · 46 following
View GitHub Profile
@plmrry
plmrry / README.md
Last active August 29, 2015 14:24
Stacked Attribute Transitions

This is a technique for storing attribute states in a stack.

When your mouse exits a node, it returns to the most recent state that was pushed into an array of states. This allows for state transitions.

An alternative method could use getComputedStyle to pre-compute styles from a stylesheet (which would then be used in a transition).

@plmrry
plmrry / index.html
Last active August 29, 2015 14:26
Force-Directed Control Point Interpolation
<!doctype html>
<html>
<head>
<meta name="description" content="Force matrix positions" />
<title>MatrixVis</title>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link href='//fonts.googleapis.com/css?family=Roboto:400,100,200,700' rel='stylesheet' type='text/css'>
<style>
@media (min-width: 1600px) {
.container {
@plmrry
plmrry / index.html
Last active November 19, 2015 19:26
Twitchy Canvas Particles
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="2: circles canvas">
<script src="//code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="http://d3js.org/d3.v3.min.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
@plmrry
plmrry / index.html
Last active November 19, 2015 19:25
Particle Experiments II
<!DOCTYPE html>
<html>
<head>
<script src="http://d3js.org/d3.v3.min.js"></script>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<script>
var margin = { top: 50, left: 50, bottom: 50, right: 50 },
@plmrry
plmrry / index.html
Last active August 29, 2015 14:27
Particle Experiments
<!DOCTYPE html>
<html>
<head>
<script src="http://d3js.org/d3.v3.min.js"></script>
<meta charset="utf-8">
</head>
<body>
<script src="script.js"></script>
</body>
</html>
@plmrry
plmrry / README.md
Last active December 16, 2015 21:13
Tree-to-Force Interpolation

Move the slider to interpolate between a tree layout and a force-directed layout.

Based on Jim Vallandingham's talk, Abusing The Force.

@plmrry
plmrry / index.html
Last active August 29, 2015 14:27
Tree Update Pattern
<!DOCTYPE html>
<html>
<head>
<script src="http://d3js.org/d3.v3.min.js"></script>
<meta charset="utf-8">
</head>
<body>
<script src="script.js"></script>
</body>
</html>
@plmrry
plmrry / README.md
Last active November 20, 2015 05:19
Simple Gradient Along Stroke

A less-sophisticated alternative to Mike Bostock's Gradient Along Stroke.

Note that this version does not compute mitre joints, so sharp bends reveal the segmented nature of the "path."

@plmrry
plmrry / index.html
Last active August 29, 2015 14:27
Bar Chart Update Pattern
<!DOCTYPE html>
<html>
<head>
<script src="http://d3js.org/d3.v3.min.js"></script>
<meta charset="utf-8">
</head>
<body>
<script src="script.js"></script>
</body>
</html>
@plmrry
plmrry / README.md
Last active November 19, 2015 19:33
StretchPlot

StretchPlot allows users to interactively interrogate multivariate datasets in real-time by "stretching" data into data into a two-dimensional display. The position of each element is based on a linear combination of variables determined by the analyst. The technique is particularly relevant to geotemporal data, where geography and time interact with a number of other variables.