Learn D3.js

Rotate and zoom to object

This function creates a d3.geoRotation() function from the projection, and then uses it to obtain the three rotated coordinates of the centroid. It then rotates the projection using these coordinates so that the object's centroid is in its center:

function rotateToView(object) {     const rotate = d3.geoRotation(projection.rotate()),           centroid = d3.geoCentroid(object); const rotation = rotate(centroid); const lambda = projection.rotate()[0] - rotation[0],         phi = projection.rotate()[1] - rotation[1],       gamma = projection.rotate()[2];projection.rotate([lambda, phi, gamma]);const epsilon = 1e-6;if(Math.abs(rotation[0]) >= epsilon || Math.abs(rotation[1]) >= epsilon){        return rotateToView(object);    }    return rotation;}

Now we can ...