CODEWITHSUNDEEP
javascriptjquerymapsleaflet
Oleg Rogov
Oleg Rogov

Reputation: 720

Leaflet JS polygon on a same map

I use Leaflet JS, and I need same polygon on a one map

Now: enter image description here

I need:

enter image description here

Thank's for your help!

If I set the noWrap:true on the tileLayer or the worldCopyJump:true I get:

enter image description here

Fiddle – jsfiddle.net/paRxe/5

 var map = L.map('mapId',{
            center: [35.67989, 139.76463],
            zoom: 2,
            // worldCopyJump: true,
            maxZoom: 18,
            minZoom: 1,
            // reuseTiles: true,
            // continuousWorld: trie
            // reuseTiles: true,
            // continuousWorld: true  
            worldCopyJump: true       
          }
        );

Upvotes: 0

Views: 478

Answers (1)

ghybs
ghybs

Reputation: 53185

Your 2 polygons are actually part of a multipolygon, forming a single feature.

You could use Turf.js for example, in order to 1) translate one of the part by 360 degrees, and 2) merge those 2 parts. Then record the new feature geometry to replace your current GeoJSON data.

For step 1), you should also be able to use directly Leaflet with latLng.wrap() method.

Upvotes: 1

Related Questions