hugolpz

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.

hugolpz

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.

References

• Lets Make a Map
• Multi-Foci Force Layout

hugolpz

6 Shaded Reliefs

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):

hugolpz

.DS_Store
build
node_modules

hugolpz

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"]);

hugolpz

[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.

hugolpz

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.

hugolpz

A complete, automatic and flexible orthographic localisator for Wikipedia maps.

var bb = { "item":"India", "W": 67.0, "N":37.5, "E": 99.0, "S": 5.0 }, 
localisator("body", 200, bb.item, bb.W, bb.N, bb.E, bb.S);

It take as input :

• a JS selector: a target html element's selector such as "body", "#hook", to be appended to,

hugolpz

This gist is a starting point to code a function buiding wikiatlas keys. It also gather helpful resources to learn and code further. Collaborative and versionned coding, fork, can be done on Codio.

We dream of...

Ideally, the function should take as input :

• the range [zmin, zmax] (?),
• an array for positives values [0, 50 200, 500, <zmax>],
• an array for negative values [, -200, -100, -50, 0]

hugolpz

d3.svg.legend provides for a simple legend that can be displayed horizontally or vertically and accepts a few different d3 scale types.