NewsStand/D3 mashup, based on the GitHub Octoverse activity visualization.
To refresh the top stories data:
wget http://newsstand.umiacs.umd.edu/news/top_stories_json -O top_stories.json
NewsStand/D3 mashup, based on the GitHub Octoverse activity visualization.
To refresh the top stories data:
wget http://newsstand.umiacs.umd.edu/news/top_stories_json -O top_stories.json
build/ |
build/ |
A visualization of table decomposition. This visualization uses "phantom" table rows and cells to demonstrate decomposition boundaries.
d3 = function() { | |
var d3 = { | |
version: "3.2.1" | |
}; | |
if (!Date.now) Date.now = function() { | |
return +new Date(); | |
}; | |
var d3_document = document, d3_documentElement = d3_document.documentElement, d3_window = window; | |
try { | |
d3_document.createElement("div").style.setProperty("opacity", 0, ""); |
Visualization of a simulated annealing algorithm for laying out itineraries. Each rectangle contains an ordered set of stops (an "itinerary") to be rendered. The algorithm searches for an appropriate layout by modifying the curvature of lines between consecutive stops and the positions of the stop labels. Layouts are penalized for intersections between elements, extending outside of the bounding rectangle, and violating other aesthetic criteria. A new layout is accepted if it is better than the previous layout or with some probability that tends to 0 if it is worse.
Simulated annealing avoids the cost of an exhaustive brute-force approach,
A fork of Mike Bostock's Geographic Projection Example. Uses the path.area method of d3.geo.path() to compute the projected area (in pixels) of each country.
These projections are available in the geo.projection plugin.
sample-data/ |
Testing out the Lab color space.
Each square represents a cross-section of the Lab color space with a different lightness value (from 5 to 100). The a and b values vary along the x and y dimensions, respectively (from -100 to 100).
These ranges capture most of the L, a, b combinations that map to valid RGB values (between 0 and 255).
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="utf-8" /> | |
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.7/leaflet.css" /> | |
<script src="http://d3js.org/d3.v3.min.js" type="text/javascript"></script> | |
<script src="http://cdn.leafletjs.com/leaflet-0.7/leaflet.js"></script> | |
<script src='https://api.tiles.mapbox.com/mapbox.js/v1.6.4/mapbox.js'></script> | |
<link href='https://api.tiles.mapbox.com/mapbox.js/v1.6.4/mapbox.css' rel='stylesheet' /> |