1

I've been trying to find a way to repeat a world map projection (at least 1x on each side) so that the edge of the map doesn't fall into whitespace - as per this example.

I'd like to do this without having to use tiles (every solution I've seen up to date used leaflet or google maps), hopefully this is possible with only d3.js?

EDIT: works like this http://bl.ocks.org/l-r/7952739

L-R
  • 1,214
  • 1
  • 19
  • 40
  • When I was having a [similar problem](http://stackoverflow.com/questions/14909054/zooming-and-panning-a-mercator-map-centered-on-the-pacific-using-d3-js) (hence the example you quote) it was solved by patriksurry with a great example [here](http://bl.ocks.org/patricksurry/6621971) – d3noob Dec 14 '13 at 04:04

1 Answers1

1

You would have to do exactly what you're saying -- add another projection next to the other one. This would essentially be tiling, but with SVGs (or whatever you're using to draw the map). The basic idea is to have several projections side-by-side with appropriate translations.

Alternatively, you could simply project onto a sphere, see e.g. this example.

Lars Kotthoff
  • 107,425
  • 16
  • 204
  • 204
  • for reference, I got a quick example to work (somehow the JSON won't load properly...) http://bl.ocks.org/l-r/7952739 – L-R Dec 13 '13 at 22:51