Fil/.block

## .block
license: mit

## README.md

      
    Raw
  

              README.md
            
          
    forked from jasondavies's block: Geographic Clipping: Spiral [UNLISTED]

  
## index.html
<!DOCTYPE html>
<meta charset="utf-8">
<title>Geographic Clipping of Spiral</title>
<body>
<script src="http://d3js.org/d3.v2.min.js"></script>
<script src="https://raw.githack.com/d3/d3-plugins/67c2f21e93e9a589dd17038c3b2e69f58ddfd8f2/geo/clip/clip.js"></script>
<script>
var xy = d3.geo.azimuthal().scale(200).mode("orthographic").origin([0, 90]),
    dy = 5,
    clip = d3.geo.clip().origin([0, 90]),
    path = d3.geo.path().projection(xy),
    svg = d3.select("body").append("svg")
.attr('width', 960)
.attr('height', 600)
,
    n = 1000;

var origin = [0, 0],
    velocity = [.1, .01],
    t0 = Date.now();

var spiral = d3.range(0, 1 + 1 / n, 1 / n).map(function(t) {
  return [(360 * 10 * t) % 360 - 180, -90 + dy + (90 - dy) * 2 * t];
}).concat(d3.range(1, 0, -1 / n).map(function(t) {
  return [(360 * 10 * t) % 360 - 180, -90 + (90 - dy) * 2 * t];
}));
spiral.push(spiral[0]);

var a = svg.append("path")
    .datum({type: "Polygon", coordinates: [spiral]})
.attr("d", path);

  //if (0)
d3.timer(function() {
  var t = Date.now() - t0,
      o = [origin[0] + t * velocity[0], origin[1] + t * velocity[1]];
  xy.origin(o);
  clip.origin(o);
  a.attr("d", function(d) { return path(clip(d)); });
});
</script>
	<!DOCTYPE html>
	<meta charset="utf-8">
	<title>Geographic Clipping of Spiral</title>
	<body>
	<script src="http://d3js.org/d3.v2.min.js"></script>
	<script src="https://raw.githack.com/d3/d3-plugins/67c2f21e93e9a589dd17038c3b2e69f58ddfd8f2/geo/clip/clip.js"></script>
	<script>
	var xy = d3.geo.azimuthal().scale(200).mode("orthographic").origin([0, 90]),
	dy = 5,
	clip = d3.geo.clip().origin([0, 90]),
	path = d3.geo.path().projection(xy),
	svg = d3.select("body").append("svg")
	.attr('width', 960)
	.attr('height', 600)
	,
	n = 1000;

	var origin = [0, 0],
	velocity = [.1, .01],
	t0 = Date.now();

	var spiral = d3.range(0, 1 + 1 / n, 1 / n).map(function(t) {
	return [(360 * 10 * t) % 360 - 180, -90 + dy + (90 - dy) * 2 * t];
	}).concat(d3.range(1, 0, -1 / n).map(function(t) {
	return [(360 * 10 * t) % 360 - 180, -90 + (90 - dy) * 2 * t];
	}));
	spiral.push(spiral[0]);

	var a = svg.append("path")
	.datum({type: "Polygon", coordinates: [spiral]})
	.attr("d", path);

	//if (0)
	d3.timer(function() {
	var t = Date.now() - t0,
	o = [origin[0] + t * velocity[0], origin[1] + t * velocity[1]];
	xy.origin(o);
	clip.origin(o);
	a.attr("d", function(d) { return path(clip(d)); });
	});
	</script>