StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>Are you looking for a choropleth map? Here's a <a href="http://bl.ocks.org/3306362" rel="noreferrer">recent example in 28 lines of code</a>.</p> <p>This example uses the default projection, <a href="https://github.com/mbostock/d3/wiki/Geo-Projections#wiki-albersUsa" rel="noreferrer">d3.geo.albersUsa</a>, which is a composite projection for the United States including Alaska, Hawaii and Puerto Rico. If you want to change the visible region, you probably also want to change the projection; <a href="https://github.com/mbostock/d3/wiki/Geo-Projections#wiki-albers" rel="noreferrer">d3.geo.albers</a> is good for choropleth maps because it is equal-area. The albers projection lets you set the <a href="https://github.com/mbostock/d3/wiki/Geo-Projections#wiki-albers_origin" rel="noreferrer">origin</a> so that you can focus on a specific part of the global, and all projections allow you to specify <a href="https://github.com/mbostock/d3/wiki/Geo-Projections#wiki-albers_scale" rel="noreferrer">scale</a> and <a href="https://github.com/mbostock/d3/wiki/Geo-Projections#wiki-albers_translate" rel="noreferrer">translate</a> to position the map on-screen.</p> <p>If you want to display a world map, I'd also take a look at the ongoing development of the <a href="https://github.com/d3/d3-plugins/tree/master/geo/projection" rel="noreferrer">extended projections plugin</a>. This adds a number of useful map projections, particularly for world maps, such as the <a href="http://bl.ocks.org/3682676" rel="noreferrer">Winkel Tripel</a>. The next release of D3 will also include some exciting new features such as three-dimensional rotation for any projection (including antemeridian cutting; try <a href="http://bl.ocks.org/3788999" rel="noreferrer">dragging this example</a>), <a href="http://bl.ocks.org/3795544" rel="noreferrer">adaptive resampling</a> and improved clipping.</p> <p>As for coloring the choropleth, you can of course color geographic features however you like by redefining the "fill" style as a function of data.</p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload