The Waterman butterfly projection is available as d3.geo.polyhedron.waterman
in the geo.polyhedron D3 plugin. Implemented by Jason Davies; see his interactive rotating version.
// Comment on single line or end of line | |
/* Comment on... | |
multiple lines */ | |
/** | |
GROUP.Fn: What it does. | |
* @syntax: fn (par1, par2, par3); | |
* @param : (explanation & nature) | |
* @return: (explanation & nature) |
fra.json: countries.json subunits.json places.json | |
topojson --id-property none -p name=name -p name=NAME -o fra0813b.json -- countries.json subunits.json places.json | |
### FILES FILTERS & 2JSON | |
countries.json: ne_10m_admin_0_sovereignty.shp | |
ogr2ogr -f GeoJSON -where "admin IN ('Spain', 'Italy', 'Andorra', 'Switzerland', 'Belgium', 'Netherlands', 'Luxembourg', 'Germany', 'United Kingdom')" countries.json ne_10m_admin_0_sovereignty.shp | |
subunits.json: ne_10m_admin_1_states_provinces_shp | |
ogr2ogr -f GeoJSON -where "admin IN ('France')" subunits.json ne_10m_admin_1_states_provinces_shp.shp | |
places.json: ne_10m_populated_places.shp | |
ogr2ogr -f GeoJSON -where "ADM0NAME = 'France' OR SOV0NAME = 'French Republic' OR ISO_A2 = 'FR' AND FEATURECLA = 'Admin-1 region capital'" places.json ne_10m_populated_places.shp |
By Navarro. See also: D3js: Automatic labels placement to avoid overlaps? (force repulsion)
This example is an extension of Mike Bostock’s tutorial Lets Make a Map that implements automatic label placement using the force layout and multiple foci. The centroid of each feature will define a foci of the force. This foci will attract the label that correspond to that feature (and ignore the others). The labels will repel themselves to avoid overlapping.
Action: When run, this country.makefile
[download][1] the raster GIS DEM sources, process them (unzip, crop, shaded relief, resize, colorize), to output 6 elegant shaded reliefs. Can work for any country or area, given you provide WNES
(West/North/East/South) geocoordinates, in decimal degrees.
Output:
- 2 hillshades:
- hillshade_grey (GIS tif)
- hillshade_trans (png)
- 1 color-relief (wikipedia style):
.DS_Store | |
build | |
node_modules |
By mbostock. Forked for later adaptation.
This choropleth uses a threshold scale for quantization, mapping arbitrary slices of a continuous domain to discrete values in the range. Unemployment rates ranging from 2 to 10% are quantized into different shades of purple.
var color = d3.scale.threshold()
.domain([.02, .04, .06, .08, .10])
.range(["#f2f0f7", "#dadaeb", "#bcbddc", "#9e9ac8", "#756bb1", "#54278f"]);
[By Mike Bostock, for later reuse.]
A quick visual reference to every ColorBrewer scale; colors by Cynthia Brewer. Available in CSS and JS format. Click on a palette to log the constituent colors in hexadecimal RGB to the console.
Shown is Lake Superior and the surrounding terrain, using data from NASA’s Shuttle Radar Topography Mission and [bathymetry data from NOAA][noaa].
The two images are layered using a clipping path of the lake, from Natural Earth’s 10m vector lake dataset.
Hill relief, as usual, was generated using the gdal
utility suite.
Proof of concept of grayscale image recolored directly via D3js color scale. Wikimaps colors used.
Source: The source image is a global heightmap from the Shuttle Radar Topography Mission, released as part of NASA’s Blue Marble collection at 8km resolution. The topography data is stored in a simple 130KB black&white, 8-bit PNG. In it, darker values represent lower elevations (sea floor), lighter values represent higher elevations (mountains).
Colors are read out of the image using the Canvas API.
Data properties:
[0,255]
: there are 8 bits per channel, values range thus is[0-255]
.0
: the [deepest depression below sea level](http://en.wikipedia.org/wiki/List_of_plac