Skip to content

Upgrade d3 geo projections #5112

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 19 commits into from
Jun 30, 2021
Merged

Upgrade d3 geo projections #5112

Show file tree
Hide file tree
Changes from 14 commits
Commits
Show all changes
19 commits
Select commit Hold shift + click to select a range
9f679fd
apply latest d3-geo v1 and d3-geo-projection v2
archmoj Jul 29, 2020
f17f3bf
update two baselines
archmoj Jul 30, 2020
a7735e6
remove tests related to unhandled bugs in the previous d3-geo functions
archmoj Sep 1, 2020
7730d43
link to d3 v3 without geo
archmoj Jan 14, 2021
8dd4ba0
add comment about the potential projections to add
archmoj Jan 14, 2021
7e36f6c
Merge remote-tracking branch 'origin' into new-d3-geo
archmoj Jan 14, 2021
557ebde
remove unused geo/projections.js file
archmoj Jan 14, 2021
1b4fd15
Merge remote-tracking branch 'origin/master' into new-d3-geo
archmoj Jan 20, 2021
f46e4af
Revert "remove tests related to unhandled bugs in the previous d3-geo…
archmoj Jan 21, 2021
d5d352c
no longer need to add fitExtend from d3 v4
archmoj Jan 21, 2021
b9be8c1
Merge remote-tracking branch 'origin/master' into new-d3-geo
archmoj May 22, 2021
d5883d2
no longer need to check for NaN with d3-geo
archmoj May 22, 2021
647b0dc
adjust geo test - previous test used to fail locally on master too
archmoj May 22, 2021
a046871
clear fallback to default view - no longer NaNs in d3-geo
archmoj May 22, 2021
98c19b8
fixup geo requires
archmoj May 25, 2021
905eeb0
Merge remote-tracking branch 'origin/master' into new-d3-geo
archmoj Jun 26, 2021
0a7ed9f
regenerate two baselines using kaleido
archmoj Jun 26, 2021
be527cf
use plotly/d3 v3.7.0 which no longer has geo part
archmoj Jun 30, 2021
32aeac6
Merge remote-tracking branch 'origin/master' into new-d3-geo
archmoj Jun 30, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 21 additions & 3 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 3 additions & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,7 @@
]
},
"dependencies": {
"@plotly/d3": "^3.5.18",
"@plotly/d3": "git://github.com/plotly/d3.git#e792de9ae52d956d18582cac8a49ea6a03c7e010",
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

plotly/d3@master...plotly:drop-geo

"@plotly/d3-sankey": "0.7.2",
"@plotly/d3-sankey-circular": "0.33.1",
"@plotly/point-cluster": "^3.1.9",
Expand All @@ -81,6 +81,8 @@
"convex-hull": "^1.0.3",
"country-regex": "^1.1.0",
"d3-force": "^1.2.1",
"d3-geo": "^1.12.1",
"d3-geo-projection": "^2.9.0",
"d3-hierarchy": "^1.1.9",
"d3-interpolate": "^1.4.0",
"d3-time-format": "^2.2.3",
Expand Down
103 changes: 101 additions & 2 deletions src/plots/geo/constants.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,6 @@

// projection names to d3 function name
exports.projNames = {
// d3.geo.projection
'equirectangular': 'equirectangular',
'mercator': 'mercator',
'orthographic': 'orthographic',
Expand All @@ -24,7 +23,107 @@ exports.projNames = {
'albers usa': 'albersUsa',
'winkel tripel': 'winkel3',
'aitoff': 'aitoff',
'sinusoidal': 'sinusoidal'
'sinusoidal': 'sinusoidal',
/*
// potential projections that could be added to the API

'airy': 'airy',
// 'albers': 'albers',
'armadillo': 'armadillo',
'august': 'august',
'baker': 'baker',
'berghaus': 'berghaus',
'bertin1953': 'bertin1953',
'boggs': 'boggs',
'bonne': 'bonne',
'bottomley': 'bottomley',
'bromley': 'bromley',
// 'chamberlin': 'chamberlin',
'chamberlin africa': 'chamberlinAfrica',
'collignon': 'collignon',
'craig': 'craig',
'craster': 'craster',
'cylindrical equal area': 'cylindricalEqualArea',
'cylindrical stereographic': 'cylindricalStereographic',
'eckert1': 'eckert1',
'eckert2': 'eckert2',
'eckert3': 'eckert3',
'eckert5': 'eckert5',
'eckert6': 'eckert6',
'eisenlohr': 'eisenlohr',
'fahey': 'fahey',
'foucaut': 'foucaut',
'foucaut sinusoidal': 'foucautSinusoidal',
'gilbert': 'gilbert',
'gingery': 'gingery',
'ginzburg4': 'ginzburg4',
'ginzburg5': 'ginzburg5',
'ginzburg6': 'ginzburg6',
'ginzburg8': 'ginzburg8',
'ginzburg9': 'ginzburg9',
'gringorten': 'gringorten',
'guyou': 'guyou',
'hammer retroazimuthal': 'hammerRetroazimuthal',
'healpix': 'healpix',
'hill': 'hill',
'homolosine': 'homolosine',
'hufnagel': 'hufnagel',
'hyperelliptical': 'hyperelliptical',
'lagrange': 'lagrange',
'larrivee': 'larrivee',
'laskowski': 'laskowski',
'littrow': 'littrow',
'loximuthal': 'loximuthal',
// 'modified stereographic': 'modifiedStereographic',
'modified stereographic alaska': 'modifiedStereographicAlaska',
'modified stereographic gs48': 'modifiedStereographicGs48',
'modified stereographic gs50': 'modifiedStereographicGs50',
'modified stereographic miller': 'modifiedStereographicMiller',
'modified stereographic lee': 'modifiedStereographicLee',
'mt flat polar parabolic': 'mtFlatPolarParabolic',
'mt flat polar quartic': 'mtFlatPolarQuartic',
'mt flat polar sinusoidal': 'mtFlatPolarSinusoidal',
'natural earth1': 'naturalEarth1',
'natural earth2': 'naturalEarth2',
'nell hammer': 'nellHammer',
'nicolosi': 'nicolosi',
'patterson': 'patterson',
'polyconic': 'polyconic',
'rectangular polyconic': 'rectangularPolyconic',
'satellite': 'satellite',
'sinu mollweide': 'sinuMollweide',
'times': 'times',
// 'two point azimuthal': 'twoPointAzimuthal',
// 'two point azimuthalUsa': 'twoPointAzimuthalUsa',
// 'two point equidistant': 'twoPointEquidistant',
// 'two point equidistantUsa': 'twoPointEquidistantUsa',
'van der grinten': 'vanDerGrinten',
'van der grinten2': 'vanDerGrinten2',
'van der grinten3': 'vanDerGrinten3',
'van der grinten4': 'vanDerGrinten4',
// 'wagner': 'wagner',
'wagner4': 'wagner4',
'wagner6': 'wagner6',
// 'wagner7': 'wagner7',
'wiechel': 'wiechel',
'winkel3': 'winkel3',

// 'interrupt': 'interrupt',
'interrupted homolosine': 'interruptedHomolosine',
'interrupted sinusoidal': 'interruptedSinusoidal',
'interrupted boggs': 'interruptedBoggs',
'interrupted sinu mollweide': 'interruptedSinuMollweide',
'interrupted mollweide': 'interruptedMollweide',
'interrupted mollweide hemispheres': 'interruptedMollweideHemispheres',
'interrupted quartic authalic': 'interruptedQuarticAuthalic',

'polyhedral butterfly': 'polyhedralButterfly',
'polyhedral collignon': 'polyhedralCollignon',
'polyhedral waterman': 'polyhedralWaterman',

'gringorten quincuncial': 'gringortenQuincuncial',
'peirce quincuncial': 'peirceQuincuncial',
*/
};

// name of the axes
Expand Down
69 changes: 13 additions & 56 deletions src/plots/geo/geo.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,10 @@
/* global PlotlyGeoAssets:false */

var d3 = require('@plotly/d3');
var geo = require('d3-geo');
var geoPath = require('d3-geo').geoPath;
var geoDistance = require('d3-geo').geoDistance;
var geoProjection = require('d3-geo-projection');

var Registry = require('../../registry');
var Lib = require('../../lib');
Expand All @@ -25,8 +29,6 @@ var geoUtils = require('../../lib/geo_location_utils');
var topojsonUtils = require('../../lib/topojson_utils');
var topojsonFeature = require('topojson-client').feature;

require('./projections')(d3);

function Geo(opts) {
this.id = opts.id;
this.graphDiv = opts.graphDiv;
Expand Down Expand Up @@ -247,29 +249,6 @@ proto.updateProjection = function(geoCalcData, fullLayout) {
var s = this.fitScale = projection.scale();
var t = projection.translate();

if(
!isFinite(b[0][0]) || !isFinite(b[0][1]) ||
!isFinite(b[1][0]) || !isFinite(b[1][1]) ||
isNaN(t[0]) || isNaN(t[0])
) {
var attrToUnset = ['fitbounds', 'projection.rotation', 'center', 'lonaxis.range', 'lataxis.range'];
var msg = 'Invalid geo settings, relayout\'ing to default view.';
var updateObj = {};

// clear all attributes that could cause invalid bounds,
// clear viewInitial to update reset-view behavior

for(var i = 0; i < attrToUnset.length; i++) {
updateObj[this.id + '.' + attrToUnset[i]] = null;
}

this.viewInitial = null;

Lib.warn(msg);
gd._promises.push(Registry.call('relayout', gd, updateObj));
return msg;
}

if(geoLayout.fitbounds) {
var b2 = projection.getBounds(makeRangeBox(axLon.range, axLat.range));
var k2 = Math.min(
Expand Down Expand Up @@ -508,7 +487,7 @@ proto.updateFx = function(fullLayout, geoLayout) {
bgRect.on('mousemove', function() {
var lonlat = _this.projection.invert(d3.mouse(this));

if(!lonlat || isNaN(lonlat[0]) || isNaN(lonlat[1])) {
if(!lonlat) {
return dragElement.unhover(gd, d3.event);
}

Expand Down Expand Up @@ -648,9 +627,8 @@ proto.render = function() {
}
};

// Helper that wraps d3.geo[/* projection name /*]() which:
// Helper that wraps d3[geo + /* Projection name /*]() which:
//
// - adds 'fitExtent' (available in d3 v4)
// - adds 'getPath', 'getBounds' convenience methods
// - scopes logic related to 'clipAngle'
// - adds 'isLonLatOverEdges' method
Expand All @@ -663,7 +641,11 @@ function getProjection(geoLayout) {
var projLayout = geoLayout.projection;
var projType = projLayout.type;

var projection = d3.geo[constants.projNames[projType]]();
var projName = constants.projNames[projType];
// uppercase the first letter and add geo to the start of method name
projName = 'geo' + projName.charAt(0).toUpperCase() + projName.slice(1);
var projFn = geo[projName] || geoProjection[projName];
var projection = projFn();

var clipAngle = geoLayout._isClipped ?
constants.lonaxisSpan[projType] / 2 :
Expand All @@ -686,7 +668,7 @@ function getProjection(geoLayout) {

if(clipAngle) {
var r = projection.rotate();
var angle = d3.geo.distance(lonlat, [-r[0], -r[1]]);
var angle = geoDistance(lonlat, [-r[0], -r[1]]);
var maxAngle = clipAngle * Math.PI / 180;
return angle > maxAngle;
} else {
Expand All @@ -695,38 +677,13 @@ function getProjection(geoLayout) {
};

projection.getPath = function() {
return d3.geo.path().projection(projection);
return geoPath().projection(projection);
};

projection.getBounds = function(object) {
return projection.getPath().bounds(object);
};

// adapted from d3 v4:
// https://github.com/d3/d3-geo/blob/master/src/projection/fit.js
projection.fitExtent = function(extent, object) {
var w = extent[1][0] - extent[0][0];
var h = extent[1][1] - extent[0][1];
var clip = projection.clipExtent && projection.clipExtent();

projection
.scale(150)
.translate([0, 0]);

if(clip) projection.clipExtent(null);

var b = projection.getBounds(object);
var k = Math.min(w / (b[1][0] - b[0][0]), h / (b[1][1] - b[0][1]));
var x = +extent[0][0] + (w - k * (b[1][0] + b[0][0])) / 2;
var y = +extent[0][1] + (h - k * (b[1][1] + b[0][1])) / 2;

if(clip) projection.clipExtent(clip);

return projection
.scale(k * 150)
.translate([x, y]);
};

projection.precision(constants.precision);

if(clipAngle) {
Expand Down
Loading