0

I would like to perform a counter-clockwise rotation of a country polygon about an origin in d3.geo.

For example, let's rotate Italy -7.2 degrees around a point with λ=0.5, φ=49.9. First, we need to transform those Euler angles into an Affine transformation parameters. In our case, the parameters will be:

affine(0.5, 49.9, -7.2)
   scaleX      rotY    transX       rotX    scaleY   transY
0.9921147 0.1253332 -6.250186 -0.1253332 0.9921147 0.456143

When I use QGIS Affine Transform plugin with such parameters the resulting map is here.

When I apply the same parameters to projection.stream in d3.js, the result is very different (and incorrect): https://bl.ocks.org/memoryfull/946a8172d074a865c4ff

I am handling the projection stream correctly in my code, because an (1, 0, 0, 0, 1, 0) Affine transformation yields an expected result of no transformation.

Thank you in advance for your help.

Community
  • 1
  • 1
Dmitriy Skougarevskiy
  • 51
  • 4
  • References: [On embedded projection streams](http://stackoverflow.com/questions/27557724/what-is-the-proper-way-to-use-d3s-projection-stream), [Mike Bostock's example on custom projections](http://bl.ocks.org/mbostock/5663666), [QGIS parameters used](http://i.stack.imgur.com/tcTBy.png) – Dmitriy Skougarevskiy Oct 11 '15 at 22:01
  • It looks like it's been rotated about the origin (top left) of the entire SVG element in your code. What you probably need is to translate Italy to the origin, apply your transformation, and then translate back – Roland Heath Oct 11 '15 at 22:50
  • @RolandHeath thank you for the suggestion. I am afraid this is not the case. It would be had I done a simple transformation of Italy, without a second stream: `.attr("d", d3.geo.path().projection(d3.geo.transform({ point: function(x, y) { this.stream.point(0.992 * x + 0.125 * y - 6.25, -0.125 * x + 0.992 * y + 0.456); } }) ));` – Dmitriy Skougarevskiy Oct 12 '15 at 08:17

0 Answers0