dattn / dnd-grid

A vuejs grid with draggable and resizable boxes
307 stars 48 forks source link

Leaflet maps shifted when inserted into Box #39

Open devleaks opened 6 years ago

devleaks commented 6 years ago

Hello,

I'm building a dashboard-like ui and added a leaflet map in a Box. Unfortunately, all layers above the map are "shifted" by ½ div width and ½ div height. (I've tried with other layers than marker or geojson, they are shifted as well.)

Any clue where this might come from?

I made a vue sandbox here.

When you start the sandbox, there should be a marker in the middle of the map. The marker is actually in at position 0,0 on the div (instead of the center) and you don't see it. The orange polygon should cover the airfield in the lower right part of the screen.

If you "zoom out" by clicking the - icon, you will actually see the marker moving to the center of the map, and the polygon will shift and cover the small airport.

If you simply replace the tag with plain

, the overlays are not shifted.

Any idea where this might come from?

Thanks.

Best regards.

dattn commented 6 years ago

Your sandbox does not work for me, the result is a blank page. Can you please fix it, so i can take a look at your problem.

devleaks commented 6 years ago

Which browser/os? I just tested on Safari, Chrome and Firefox on OSX 10.10 and 10.13 and they all work. I also tested ios 11.4 on iPad and also works. I don't have any Window box around. I can provide screen dumps if you wish.