I'd like to do a smooth transition between alber/orthographic in a mini app I am building, much like this example:
http://mbostock.github.io/d3/talk/20111018/#27
It seems like this smooth transition is broken in v3 however, with a rather choppy transition of the map paths:
Code is pretty straight forward, I initialize the map as albers, then run ortho() to update it.
function ortho() {
var self = this,
h = 1000,
w = document.width;
this.projection = d3.geo.orthographic()
.scale(500)
.translate([ (w - 300) / 2, h / 2])
.clipAngle(90)
.rotate([90, 0, 0])
.precision(.1);
this.path = d3.geo.path()
.projection(this.projection);
//update path WITH transition
d3.selectAll('path')
.transition()
.duration(900)
.attr('d', app.path);
}
The map changes from albers to orthographic, but the transition is not smooth. Any thoughts would be great.
See Question&Answers more detail:os