Set of d3 projections for showing countries' distant lands together
This is the version compatible with d3v4, please go here for the version compatible with d3v3.
The projection itself works the same way as the other d3 projections. To be more precise, exactly as the albersUsa projection:
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="d3-composite-projections.js"></script>
var projection = d3.geoConicConformalPortugal();
Change the scale using scale i.e. .scale(3000)
, as usual. The projections are prepared to fit a 960x500px SVG or Canvas.
The projection is available for:
- USA: geoAlbersUSA
- USA Territories: geoAlbersUsaTerritories as albersUsa, but adding the American Samoa, Puerto Rico, U.S. Virgin Islands, Guam and Northern Marianas Islands, so all the Congressional Districts are represented
- France: geoConicConformalFrance
- Portugal: geoConicConformalPortugal
- Spain: geoConicConformalSpain
- Europe: geoConicConformalEurope (thought for Eurostat data)
- Japan: geoConicEquidistantJapan
- Ecuador: geoMercatorEcuador
- Chile: geoTransverseMercatorChile, including the Chilean Antarctic Territory
To draw the borders between the projection zones, use getCompositionBorders()
for SVG:
svg.append("path")
.style("fill","none")
.style("stroke","#000")
.attr("d", path(projection.getCompositionBorders()));
or drawCompositionBorders if using Canvas:
projection.drawCompositionBorders(context);
var d3_composite = require("d3-composite-projections");
var d3_geo = require("d3-geo");
var projection = d3_composite.geoAlbersUsaTerritories();
You can get the files just by cloning the repository:
git clone https://github.com/rveciana/d3-composite-projections.git
or downloading the d3-composite-projections.js or d3-composite-projections.min.js files.
You can link the files from your web page to cdnjs:
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3-composite-projections/1.0.0/composite-projections.min.js"></script>
or
<script src="https://unpkg.com/[email protected]"></script>
npm install d3-composite-projections
This will download all the dependencies, the test files.
The tests can be run using:
npm test