Files
contao-leaflet-libraries/assets/leaflet-fullscreen/README.md

77 lines
2.4 KiB
Markdown
Raw Normal View History

2015-01-20 16:03:59 +01:00
Leaflet.Control.FullScreen
============
What ?
------
Simple plugin for Leaflet that adds fullscreen button to your maps.
Inspired by http://elidupuis.github.com/leaflet.zoomfs/
Use the native javascript fullscreen API http://johndyer.name/native-fullscreen-javascript-api-plus-jquery-plugin/
Released under the MIT License http://opensource.org/licenses/mit-license.php
How ?
------
Include Control.FullScreen.js and Control.FullScreen.css in your page:
``` html
<link rel="stylesheet" href="Control.FullScreen.css" />
<script src="Control.FullScreen.js"></script>
```
Add the fullscreen control to the map:
``` js
var map = new L.Map('map', {
fullscreenControl: true,
fullscreenControlOptions: {
position: 'topleft'
}
});
```
If your map have a zoomControl the fullscreen button will be added at the bottom of this one.
If your map doesn't have a zoomContron the fullscreen button will be added to topleft corner of the map (same as the zoomcontrol).
2018-08-23 15:40:48 +02:00
If you want to use the plugin on a map embedded in an iframe, don't forget to set `allowfullscreen` attribute on your iframe.
2015-01-20 16:03:59 +01:00
__Events and options__:
``` js
// create a fullscreen button and add it to the map
L.control.fullscreen({
position: 'topleft', // change the position of the button can be topleft, topright, bottomright or bottomleft, defaut topleft
title: 'Show me the fullscreen !', // change the title of the button, default Full Screen
2017-07-06 16:38:23 +02:00
titleCancel: 'Exit fullscreen mode', // change the title of the button when fullscreen is on, default Exit Full Screen
content: null, // change the content of the button, can be HTML, default null
2015-01-20 16:03:59 +01:00
forceSeparateButton: true, // force seperate button to detach from zoom buttons, default false
2016-10-04 13:50:43 +02:00
forcePseudoFullscreen: true, // force use of pseudo full screen even if full screen API is available, default false
fullscreenElement: false // Dom element to render in full screen, false by default, fallback to map._container
2015-01-20 16:03:59 +01:00
}).addTo(map);
// events are fired when entering or exiting fullscreen.
map.on('enterFullscreen', function(){
console.log('entered fullscreen');
});
map.on('exitFullscreen', function(){
console.log('exited fullscreen');
});
// you can also toggle fullscreen from map object
map.toggleFullScreen();
2015-01-20 16:03:59 +01:00
```
Where ?
------
Source code : https://github.com/brunob/leaflet.fullscreen
Downloads : https://github.com/brunob/leaflet.fullscreen/releases
Demo : http://brunob.github.com/leaflet.fullscreen/