Steve Haroz steveharoz

## README.md

      
              3 files
            
          
              0 forks
            
          
              0 comments
            
          
              0 stars
            
          
                steveharoz
                / README.md
            
            
              Last active
              August 29, 2015 14:04
                — forked from mbostock/.block
            
              
                Colorful Rotating Voronoi
              
          
    I'm just adding a little color to Mike Bostock's demo.
Mario Klingemann has made some beautiful Voronoi diagrams. This is my attempt to recreate them using D3. To achieve the curved cells, each side of the Voronoi polygon is subdivided into three equal-length segments and then joined using the "basis-closed" line interpolator. There are some discontinuities in the animation when the sides of a polygon approach zero which could likely be avoided by adding a minimum-length threshold to the subdivision.
If you’d like to see other instances of this pattern, Mario describes the algorithm on Flickr.

  
## index.html
<!DOCTYPE html>
<html>
<head>
	<title>Large Multiples</title>
	<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
	<style>
		rect {
			fill: #ddd;
			stroke: none;
		}

## .gitignore
.DS_Store
node_modules
npm-debug.log

## index.html
<!DOCTYPE html>
<meta charset="utf-8">
<canvas style="width:100%; height:100%"></canvas>
<script>

/* https://github.com/d3/d3-timer Copyright 2015 Mike Bostock */
"undefined"==typeof requestAnimationFrame&&(requestAnimationFrame="undefined"!=typeof window&&(window.msRequestAnimationFrame||window.mozRequestAnimationFrame||window.webkitRequestAnimationFrame||window.oRequestAnimationFrame)||function(e){return setTimeout(e,17)}),function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports):"function"==typeof define&&define.amd?define(["exports"],n):n(e.timer={})}(this,function(e){"use strict";function n(){r=m=0,c=1/0,t(u())}function t(e){if(!r){var t=e-Date.now();t>24?c>e&&(m&&clearTimeout(m),m=setTimeout(n,t),c=e):(m&&(m=clearTimeout(m),c=1/0),r=requestAnimationFrame(n))}}function i(e,n,i){i=null==i?Date.now():+i,null!=n&&(i+=+n);var o={callback:e,time:i,flush:!1,next:null};a?a.next=o:f=o,a=o,t(i)}function o(e,n,t){t=null==t?Date.now():+t,null!=n&&(t+=+n),l.callback=e,l.time=t}function u(e){e=nu

## README.md

      
              5 files
            
          
              0 forks
            
          
              0 comments
            
          
              0 stars
            
          
                steveharoz
                / README.md
            
            
              Last active
              September 14, 2015 18:02
                — forked from mbostock/.block
            
              
                Pie Chart
              
          
    Stackoverflow question: http://stackoverflow.com/questions/32549683/d3js-json-pie-chart?noredirect=1#comment52995750_32549683

  
## README.md

      
              4 files
            
          
              0 forks
            
          
              0 comments
            
          
              0 stars
            
          
                steveharoz
                / README.md
            
            
              Created
              October 24, 2013 21:45
                — forked from mbostock/.block
            
          
    This simple bar chart is constructed from a TSV file storing the frequency of letters in the English language. The chart employs conventional margins and a number of D3 features:

d3.tsv - load and parse data
d3.format - format percentages
d3.scale.ordinal - x-position encoding
d3.scale.linear - y-position encoding
d3.max - compute domains
d3.svg.axis - display axes


## index.html
<!DOCTYPE html>
<meta charset="utf-8">
<title>SANKEY Experiment</title>
<style>

.node rect {
  cursor: move;
  fill-opacity: .9;
  shape-rendering: crispEdges;
}

## .block
license: gpl-3.0

## .block
license: gpl-3.0
height: 960

## .block
license: gpl-3.0
	<!DOCTYPE html>
	<html>
	<head>
	<title>Large Multiples</title>
	<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
	<style>
	rect {
	fill: #ddd;
	stroke: none;
	}
	<!DOCTYPE html>
	<meta charset="utf-8">
	<canvas style="width:100%; height:100%"></canvas>
	<script>

	/* https://github.com/d3/d3-timer Copyright 2015 Mike Bostock */
	"undefined"==typeof requestAnimationFrame&&(requestAnimationFrame="undefined"!=typeof window&&(window.msRequestAnimationFrame\|\|window.mozRequestAnimationFrame\|\|window.webkitRequestAnimationFrame\|\|window.oRequestAnimationFrame)\|\|function(e){return setTimeout(e,17)}),function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports):"function"==typeof define&&define.amd?define(["exports"],n):n(e.timer={})}(this,function(e){"use strict";function n(){r=m=0,c=1/0,t(u())}function t(e){if(!r){var t=e-Date.now();t>24?c>e&&(m&&clearTimeout(m),m=setTimeout(n,t),c=e):(m&&(m=clearTimeout(m),c=1/0),r=requestAnimationFrame(n))}}function i(e,n,i){i=null==i?Date.now():+i,null!=n&&(i+=+n);var o={callback:e,time:i,flush:!1,next:null};a?a.next=o:f=o,a=o,t(i)}function o(e,n,t){t=null==t?Date.now():+t,null!=n&&(t+=+n),l.callback=e,l.time=t}function u(e){e=nu
	<!DOCTYPE html>
	<meta charset="utf-8">
	<title>SANKEY Experiment</title>
	<style>

	.node rect {
	cursor: move;
	fill-opacity: .9;
	shape-rendering: crispEdges;
	}