Преглед изворни кода

leaflet: added fullscreen button

Bernadette Elena Hammerle пре 3 година
родитељ
комит
19d6adcf8b
3 измењених фајлова са 18 додато и 0 уклоњено
  1. 14 0
      package-lock.json
  2. 1 0
      package.json
  3. 3 0
      src/maps/Leaflet.js

+ 14 - 0
package-lock.json

@@ -12681,6 +12681,11 @@
       "resolved": "https://registry.npmjs.org/leaflet-draw/-/leaflet-draw-1.0.4.tgz",
       "integrity": "sha512-rsQ6saQO5ST5Aj6XRFylr5zvarWgzWnrg46zQ1MEOEIHsppdC/8hnN8qMoFvACsPvTioAuysya/TVtog15tyAQ=="
     },
+    "leaflet.fullscreen": {
+      "version": "1.4.5",
+      "resolved": "https://registry.npmjs.org/leaflet.fullscreen/-/leaflet.fullscreen-1.4.5.tgz",
+      "integrity": "sha512-rQnZswt/bI2HXmYDWjvgu8GIgg5TAyJEVOXJ1SVpo+36G9/YJ4j8gt8bz7VQU5P/gs2tQNCFbuuWtKYpSw8gbA=="
+    },
     "left-pad": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/left-pad/-/left-pad-1.3.0.tgz",
@@ -16242,6 +16247,15 @@
         "lodash-es": "^4.17.10"
       }
     },
+    "react-leaflet-fullscreen": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/react-leaflet-fullscreen/-/react-leaflet-fullscreen-1.0.1.tgz",
+      "integrity": "sha512-o6zZlytomWQiWyUh6hbdlJVSgbuCHF1M7JUgS8Z6IOBUo3aFPiHKju7Osb9eKu3nTUoN1jWsm5ZNhRteY+NChQ==",
+      "requires": {
+        "leaflet.fullscreen": "1.4.5",
+        "prop-types": "^15.6.x"
+      }
+    },
     "react-lifecycles-compat": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",

+ 1 - 0
package.json

@@ -25,6 +25,7 @@
     "react-dom": "^16.14.0",
     "react-leaflet": "^2.8.0",
     "react-leaflet-draw": "^0.19.0",
+    "react-leaflet-fullscreen": "^1.0.1",
     "react-map-gl": "^5.2.11",
     "react-map-gl-draw": "^0.21.1",
     "react-mapbox-gl": "^4.8.6",

+ 3 - 0
src/maps/Leaflet.js

@@ -12,6 +12,8 @@ import {
 } from "react-leaflet";
 //import L from "leaflet";
 import {EditControl} from "react-leaflet-draw";
+import "react-leaflet-fullscreen/dist/styles.css";
+import FullscreenControl from "react-leaflet-fullscreen";
 import "./../css/maps.css";
 import {calcDistance} from "./../helpers/distance";
 import {longitude, latitude, mapWidth, mapHeight} from "./../config/variables";
@@ -187,6 +189,7 @@ export default class Leaflet extends React.Component{
 
             <ScaleControl position="bottomright"/>
             <ZoomControl position="bottomright" />
+            <FullscreenControl position="topright"/>
           </Map>
         </div>