Transitions between transforms are inherently ambiguous; there are multiple valid paths between transforms. For example, when transitioning from “rotate(180)translate(0,-100)” to “rotate(360)translate(0,-100)”, the simplest interpretation rotates from 180º to 360º, but another valid interpretation goes from “translate(0,100)rotate(180)” to “translate(0,-100)rotate(0)”.
d3.interpolateTransform chooses the latter interpretation because it first decomposes transforms into a canonical representation. This allows transitions between more complicated transforms that do not share the same structure.
In D3 2.10, you can change this behavior by specifying an interpolator via d3.tween. For example, you can use d3.interpolateString to interpolation the rotation angle.
https://d3js.org/d3.v3.min.js