Alastair Dant rflow

Fork of mbostock's block http://bl.ocks.org/mbostock/280d83080497c8c13152.

forked from dowstreet's block: Connected Particles III

Dotty particle transitions with pixi.js and the new d3v4 forceSimulation

Feel free to go large

N.b. using the RenderTexture approach to avoid redrawing circles, pixi is happy with high node counts. the force simulation starts slowing down around about the 2,000 node mark.

Keybase proof

I hereby claim:

I am rflow on github.
I am rflow (https://keybase.io/rflow) on keybase.
I have a public key ASCOgDk0ARs4Pb9GN6McJTBFVuymnqPNX4JEpSkrroQbHAo

To claim this, I am signing this object:

	<html>
	<body>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/pixi.js/4.5.1/pixi.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/chroma-js/1.3.3/chroma.min.js"></script>
	<script>

	// init Pixi for fullscreen rendering
	const doc = document.body;
	const docWidth = window.innerWidth;
	const docHeight = window.innerHeight;

	<html>
	<body>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/regl/1.3.0/regl.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/chroma-js/1.3.3/chroma.min.js"></script>
	<script>

	const regl = createREGL();

	const doc = document.body;
	const docWidth = window.innerWidth;

	<html>
	<body>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/regl/1.3.0/regl.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/chroma-js/1.3.3/chroma.min.js"></script>
	<script>

	const regl = createREGL();

	const doc = document.body;
	const docWidth = window.innerWidth;

	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="UTF-8">
	<style type="text/css">
	header {
	display: flex;
	align-items: center;
	width: 1024px;
	}