```
var p1 = d3.select('svg')
.append('polygon')
.attr('points', '100 90 100 110 10 100')
.attr('transform', 'rotate(20, 100, 100)');
p1.transition()
.duration(2000)
.attr('transform', 'rotate(160, 100, 100)')
.on('start end', function () {
console.log(p1.node().transform.baseVal.consolidate().matrix);
});
```

Codepen

It should rotate the polygon about a constant center. Instead, the rotation center moves during the transition. If you look at the logged consolidated transform matrices, this is not that suprising:

```
{ a: 0.9396926164627075, b: 0.3420201539993286, c: -0.3420201539993286, d: 0.9396926164627075, e: 40.23275375366211, f: -28.171276092529297 }
{ a: -0.9396926164627075, b: 0.3420201539993286, c: -0.3420201539993286, d: -0.9396926164627075, e: 228.17127990722656, f: 159.76724243164062 }
```

The method of blindly taking the matrix supplied by SVGTransformList.consolidate() as a basis for interpolation is clearly not appropriate in this case.

Rotating without supplying a rotation center works is as expected.