Comparing 2016 presidential election cartograms from FiveThirtyEight, Washington Post, Wall Street Journal, NPR, and Daily Kos.
Uses Polylabel to pick some decent label positions.
See also: Jigsaw morphing, Smoother polygon transitions
<!doctype html> | |
<head> | |
<meta charset="utf-8"> | |
<!-- Use the .htaccess and remove these lines to avoid edge case issues. | |
More info: h5bp.com/b/378 --> | |
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> | |
<title>Leaderboard with D3</title> |
// opacity is animated from 0 to 1 and back to 0 in a single loop | |
@include keyframes( toggle-opacity ) | |
{ | |
0%, 100% { @include opacity(0); } | |
25%, 75% { @include opacity(0.5); } | |
50% { @include opacity(1); } | |
} | |
// blink (animate toggle-opacity) |
var hierarchy_data = { | |
"name": "AUT-1", | |
"children": [{ | |
"name": "PUB-1", | |
"children": [{ | |
"name": "AUT-11", | |
"children": [{ | |
"name": "AFF-111" | |
}, { | |
"name": "AFF-112" |
Comparing 2016 presidential election cartograms from FiveThirtyEight, Washington Post, Wall Street Journal, NPR, and Daily Kos.
Uses Polylabel to pick some decent label positions.
See also: Jigsaw morphing, Smoother polygon transitions
license: gpl-3.0 |
license: gpl-3.0 |
license: mit |
d3.sankey = function() { | |
var sankey = {}, | |
nodeWidth = 24, | |
nodePadding = 8, | |
size = [1, 1], | |
nodes = [], | |
links = []; | |
sankey.nodeWidth = function(_) { | |
if (!arguments.length) return nodeWidth; |
This example demonstrates how to use the getTotalLength and getPointAtLength methods on SVG path elements to interpolate a point along a Catmull–Rom spline.
A related technique is stroke dash interpolation.
forked from mbostock's block: Point-Along-Path Interpolation
license: mit |