brunob/leaflet.fullscreen

map.toggleFullScreen is not a function

hairman opened this issue · 6 comments

hairman commented

Hello. Please tell me what am I doing wrong.

      var map = L.map('map', {
        layers: [
          L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png'),
        ],
        fullscreenControl: true,
        fullscreenControlOptions: {
          position: 'topleft',
        },
      }).setView([51.505, -0.09], 13);

      map.toggleFullScreen();


The button on the map is added and it works.
But I am getting an error:
Uncaught TypeError: map.toggleFullScreen is not a function

Tested on leaflet version 1.7.1 and 1.8.0

brunob commented

Does the example file works from your side ? Can you share a link to your code online in order to help you ?

hairman commented

Thanks for the help.
My test page.
https://cto.softmax.by/map_test_fs/

brunob commented

Ok, i see as stated in Leaflet/Leaflet.fullscreen#28 (comment) and here https://developer.mozilla.org/en-US/docs/Web/API/Element/requestFullscreen

Note: This method must be called while responding to a user interaction or a device orientation change; otherwise it will fail.

You can't call toggleFullScreen() directly, maybe i should add a not about this in the readme ?

hairman commented

ОК.
What is meant by "while responding to a user interaction"?
I added a button to call a function and that doesn't work either.

test page updated

I need to toggle FullScreen from an external function. How to do it right?
Thanks.

hairman commented

Please see this implementation.
A similar method works there.

brunob commented

Haaa my bad, toggleFullscreen != toggleFullScreen cf https://github.com/brunob/leaflet.fullscreen/blob/master/Control.FullScreen.js#L322

I'll fix the readme on this point :)

  • 👍1