0

This is now driving me insane. I've read pretty much all the posts on this, and still cannot work out how to do it efficiently, i.e. not trial and error.

I have a map of Sweden, and I basically want to zoom into the map using a lat/lon position as the center point (14.4W, 57.2N). My projection variable settings are as follows:

var projection = d3.geo.albers()
  .center([0, 57.2])
  .rotate([14.4, 0])
  .parallels([50, 60])
  .scale(900 * 3)
  .translate([width / 2, height / 2]);

At the default scale (150), the map centers properly. When I try to scale up however, I don't understand why the 14.4W, 57.2N position is not remaining in the center of the canvas?

Can anyone please shed some light? The full Gist code is here Sweden map Gist and the block is here Sweden map block

  • So whereever you use the scroll whell it shall scroll into the center of the map. Did I get it wrong or where is the sense of this? – kwoxer Oct 02 '15 at 14:06
  • No sorry, all I want to do is position the map with the coordinate detailed above at the center of the canvas. When I say zoom in, I don't mean functionality, I just to scale the map up, and have the canvas filled with the area surrounding that coordinate. – Niall Mackenzie Oct 02 '15 at 16:28
  • Have you seen [this post](https://stackoverflow.com/questions/14492284/center-a-map-in-d3-given-a-geojson-object)? – Lars Kotthoff Oct 02 '15 at 16:29
  • Thanks Lars. Three excellent explanations on that page. Mike's own I think is the easiest to understand. Can't tell you how great it is to finally have a method of doing this. – Niall Mackenzie Oct 07 '15 at 06:44

0 Answers0