{"version":3,"sources":["webpack:///./src/components/form/controls/MapPolygonControl.vue?6172","webpack:///./src/components/form/controls/MapPolygonModal.vue?2724","webpack:///src/components/form/controls/MapPolygonModal.vue","webpack:///./src/components/form/controls/MapPolygonModal.vue?3b3f","webpack:///./src/components/form/controls/MapPolygonModal.vue","webpack:///src/components/form/controls/MapPolygonControl.vue","webpack:///./src/components/form/controls/MapPolygonControl.vue?0c75","webpack:///./src/components/form/controls/MapPolygonControl.vue","webpack:///./src/components/form/controls/MapPolygon.vue?dc9c","webpack:///src/components/form/controls/MapPolygon.vue","webpack:///./src/components/form/controls/MapPolygon.vue?dc2f","webpack:///./src/components/form/controls/MapPolygon.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","_b","attrs","combinedErrors","$attrs","on","openPolygonControl","staticClass","_v","_s","value","staticRenderFns","actions","scopedSlots","_u","key","fn","title","proxy","ref","staticStyle","defaultMapCenter","isMultiple","extraPolygons","extraPolygonStyle","defaultMapZoom","val","isDrawing","selectedArea","model","callback","$$v","local","expression","name","components","MapPolygon","Modal","props","onValue","data","computed","text","disabled","handler","component","window","GA","Btn","BaseControl","mixins","methods","MapPolygonModal","width","height","getArea","totalArea","formatCoords","lat","lng","drawingLayer","externalPolygonLayer","map","drawing","edit","type","default","fillColor","color","created","L","mounted","renderMap","getMapCenter","getMapZoom","renderPolygonFromJson","onEachFeature","layer","addDrawingControl","featureGroup","poly","allowIntersection","draw","polyline","polygon","showArea","drawError","timeout","shapeOptions","circle","circlemarker","marker","rectangle","setupMap","center","zoom","maxZoom","subdomains","attribution","layers","osm","googleSat","googleStreets","position","collapsed","addTo","getVolumeOfShapeByLatLng","registerMapEvents","seeArea","renderPolygonFromInput","properties","geometry","features","emitValue","saveHec","getAreaFromSelected","area","renderExternalPolygonFromJson","style","permanent","direction","watch"],"mappings":"0IAAA,IAAIA,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,cAAcJ,EAAIM,GAAG,CAACC,MAAM,CAAC,OAASP,EAAIQ,iBAAiB,cAAcR,EAAIS,QAAO,GAAO,CAACL,EAAG,QAAQ,CAACG,MAAM,CAAC,QAAU,UAAU,MAAQ,IAAIG,GAAG,CAAC,MAAQV,EAAIW,qBAAqB,CAACP,EAAG,IAAI,CAACQ,YAAY,eAAeZ,EAAIa,GAAG,IAAIb,EAAIc,GAAGd,EAAIe,MAAQ,QAAU,YAAY,QAAQ,IACnXC,EAAkB,G,gDCDlB,EAAS,WAAa,IAAIhB,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,QAAQ,CAACG,MAAM,CAAC,iBAAiBP,EAAIiB,QAAQ,aAAa,sBAAsBC,YAAYlB,EAAImB,GAAG,CAAC,CAACC,IAAI,QAAQC,GAAG,WAAW,MAAO,CAACjB,EAAG,IAAI,CAACQ,YAAY,eAAeZ,EAAIa,GAAG,IAAIb,EAAIc,GAAGd,EAAIsB,UAAUC,OAAM,MAAS,CAACnB,EAAG,aAAa,CAACoB,IAAI,UAAUZ,YAAY,cAAca,YAAY,CAAC,aAAa,sBAAsBlB,MAAM,CAAC,qBAAqBP,EAAI0B,iBAAiB,cAAc1B,EAAI2B,WAAW,iBAAiB3B,EAAI4B,cAAc,sBAAsB5B,EAAI6B,kBAAkB,mBAAmB7B,EAAI8B,gBAAgBpB,GAAG,CAAC,QAAU,SAAUqB,GAAO,OAAQ/B,EAAIgC,UAAYD,GAAQ,gBAAgB,SAAUA,GAAO,OAAQ/B,EAAIiC,aAAeF,IAASG,MAAM,CAACnB,MAAOf,EAAS,MAAEmC,SAAS,SAAUC,GAAMpC,EAAIqC,MAAMD,GAAKE,WAAW,YAAY,IACl0B,EAAkB,G,wBCsBP,GACfC,uBACAC,YAAAC,wBAAAC,cAEAC,OACA5B,SAEA6B,WAEAlB,oBACAI,kBACAF,iBACAC,qBACAF,eAGAkB,OACA,OACAR,iBACAL,aAEAC,iBAIAa,UACAxB,QACA,kBACA,mCAEA,mCAIAL,UACA,OACA,CACA8B,qCACAC,wBACAC,aACA,cACA,6CAKA,CACAF,4CACAE,oBCvEuX,I,YCOnXC,EAAY,eACd,EACA,EACA,GACA,EACA,KACA,KACA,MAIa,EAAAA,E,6BCFfC,OAAOA,kBAAoBA,CAC3BC,QAGe,OACfb,yBACAC,YAAAa,WAAAC,oBAEAC,uBAEAC,SACA7C,qBACA,iBACA8C,EACA,CACA1C,iBACAW,qCACAI,iCACAF,sCACAC,8CACAF,2BAEAiB,gBACA,sBACA,sCACA,sBAGA,CAAAc,YAAAC,gBASAC,UAAA,6IACA,uCACA,QAEA,qCACA,6BACAC,oCAGA,4BACA,IAEA,UAOAC,gBACA,eACA,WAEA,oBACA,iBACA,CACAC,SACAC,YAMA,WAGAlB,UACAnB,aACA,gCC3FyX,ICOrX,EAAY,eACd,EACA5B,EACAiB,GACA,EACA,KACA,KACA,MAIa,e,kDClBf,IAAIjB,EAAS,WAAa,IAAIC,EAAIC,KAASC,EAAGF,EAAIG,eAAmBC,EAAGJ,EAAIK,MAAMD,IAAIF,EAAG,OAAOE,EAAG,MAAM,CAACqB,YAAY,CAAC,MAAQ,OAAO,OAAS,kBAAkBlB,MAAM,CAAC,GAAK,UACzKS,EAAkB,G,mICaP,GACfuB,kBAEAgB,gBAEAV,OACA,OACAoB,kBACAC,0BACAC,SACAC,aAIAzB,OACA0B,MACAC,aACAC,YAEA7C,oBACAI,kBACAF,iBACAC,mBACA0C,cASAC,+BACAC,mBAGA9C,YACA2C,aACAC,aAIAG,UACAC,sBAGAC,UACA,kBAGApB,SACAqB,YACA,gBAEA,oCAEA,yBACA,qCACA,+BAGAC,eACA,IACA,6DACA,SACA,sDAIAC,aACA,kCAEA,2BACA,EAGA,IAGAC,yBACA,mBACAC,sBACAC,4BACA,oEAMA,mDAGAC,oBACA,oBACA,sBACAd,MACAe,+BACAC,MACAC,uBAGAC,MACAC,YACAC,SACAH,qBACAI,YACAC,WACAlB,gBACAmB,aAEAC,iBAIAC,UACAC,gBACAC,UACAC,kBAMAC,WACA,4BAAAC,2BAAAC,yBACA,qDACA,6DAEA,yEACAC,WACAC,qCACAC,uBAGA,qEACAF,WACAC,qCACAC,uBAGA,qEACAF,WACAE,mGAGA5B,YACA6B,OACA,CACAC,sBACAC,YACAC,iBAEA,CACA,yEACA,gGAEA,CAAAC,oBAAAC,eAEAC,iBAEAC,4BACA,0DAGAC,oBACA,eAEA7C,gCACA,iDACA,gBACA,UAEA,8BACA,uDAEA,kBAGAA,kCACA,kBAGAA,iCACA,gBACA,mBAGAA,kCACA,kBAGAA,iCACA,gBACA,mBAGAA,gCACA,gBACA,mBAGAA,+BACA,IAEA,EAFA,WAGAqC,gBACAS,oEAEA,qBAMAC,yBACA,sBAEA,wDAEA,YACA,CAAA5C,eAAA6C,cAAAC,cAGA,GAAA9C,yBAAA+C,YAEA,gCACA,+BAGAC,YACA,oCAEA,mDACA,MAEA,gDACAF,uBAEA,sBACA,4DAEA,yBACA,+BAIAG,aAMAC,sBACA,QAMA,OAJA,gCACAC,sDAGA,GAGAC,gCACA,2BAEA,kBAEA,OAAApD,yBAAA+C,YAEA,mBACAM,6BACA1C,sBACA,SACAC,uBAAA0C,aAAAC,qBAAA,cAGA3C,sCAIA,YACA,4DAKA4C,OACA/G,OACAkC,UACA,gBACA,gCAKArB,eACAqB,UACA,gBACA,uCAKAmB,WACA,2BC9TkX,I,YCO9WlB,EAAY,eACd,EACAnD,EACAiB,GACA,EACA,KACA,KACA,MAIa,aAAAkC,E","file":"js/chunk-2307a32f.e9ffdd6b.js","sourcesContent":["var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('BaseControl',_vm._b({attrs:{\"errors\":_vm.combinedErrors}},'BaseControl',_vm.$attrs,false),[_c('b-btn',{attrs:{\"variant\":\"primary\",\"block\":\"\"},on:{\"click\":_vm.openPolygonControl}},[_c('i',{staticClass:\"far fa-map\"}),_vm._v(\" \"+_vm._s(_vm.value ? \"Кўриш\" : \"Белгилаш\")+\" \")])],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('Modal',{attrs:{\"footer-actions\":_vm.actions,\"slot-class\":\"d-flex flex-grow-1\"},scopedSlots:_vm._u([{key:\"title\",fn:function(){return [_c('i',{staticClass:\"far fa-map\"}),_vm._v(\" \"+_vm._s(_vm.title))]},proxy:true}])},[_c('MapPolygon',{ref:\"polygon\",staticClass:\"flex-grow-1\",staticStyle:{\"min-height\":\"calc(90vh - 150px)\"},attrs:{\"default-map-center\":_vm.defaultMapCenter,\"is-multiple\":_vm.isMultiple,\"extra-polygons\":_vm.extraPolygons,\"extra-polygon-style\":_vm.extraPolygonStyle,\"default-map-zoom\":_vm.defaultMapZoom},on:{\"drawing\":function (val) { return (_vm.isDrawing = val); },\"selected-area\":function (val) { return (_vm.selectedArea = val); }},model:{value:(_vm.local),callback:function ($$v) {_vm.local=$$v},expression:\"local\"}})],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n    <Modal :footer-actions=\"actions\" slot-class=\"d-flex flex-grow-1\">\n        <template #title><i class=\"far fa-map\" /> {{ title }}</template>\n        <MapPolygon\n            class=\"flex-grow-1\"\n            :default-map-center=\"defaultMapCenter\"\n            style=\"min-height: calc(90vh - 150px)\"\n            ref=\"polygon\"\n            @drawing=\"(val) => (isDrawing = val)\"\n            :is-multiple=\"isMultiple\"\n            :extra-polygons=\"extraPolygons\"\n            :extra-polygon-style=\"extraPolygonStyle\"\n            :default-map-zoom=\"defaultMapZoom\"\n            v-model=\"local\"\n            @selected-area=\"(val) => (selectedArea = val)\"\n        />\n    </Modal>\n</template>\n\n<script>\nimport Modal from \"@Platon/components/extended/Modal.vue\"\nimport MapPolygon from \"@Platon/components/form/controls/MapPolygon.vue\"\n\nexport default {\n    name: \"MapPolygonModal\",\n    components: { MapPolygon, Modal },\n\n    props: {\n        value: {},\n\n        onValue: {},\n\n        defaultMapCenter: {},\n        defaultMapZoom: {},\n        extraPolygons: {},\n        extraPolygonStyle: {},\n        isMultiple: {}\n    },\n\n    data() {\n        return {\n            local: this.value,\n            isDrawing: false,\n\n            selectedArea: 0\n        }\n    },\n\n    computed: {\n        title() {\n            if (this.local) {\n                return this.$l(\"platon.edit\", \"Таҳрирлаш\")\n            } else {\n                return this.$l(\"platon.pick\", \"Белгилаш\")\n            }\n        },\n\n        actions() {\n            return [\n                {\n                    text: this.$l(\"platon.save\", \"Сақлаш\"),\n                    disabled: this.isDrawing,\n                    handler: () => {\n                        if (this.onValue) {\n                            this.onValue(this.local, this.selectedArea)\n                        }\n                    }\n                },\n\n                {\n                    text: this.$l(\"platon.cancel\", \"Бекор қилиш\"),\n                    handler: () => {}\n                }\n            ]\n        }\n    }\n}\n</script>\n\n<style></style>\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./MapPolygonModal.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./MapPolygonModal.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./MapPolygonModal.vue?vue&type=template&id=632cc36d&\"\nimport script from \"./MapPolygonModal.vue?vue&type=script&lang=js&\"\nexport * from \"./MapPolygonModal.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","<template>\n    <BaseControl v-bind=\"$attrs\" :errors=\"combinedErrors\">\n        <b-btn @click=\"openPolygonControl\" variant=\"primary\" block>\n            <i class=\"far fa-map\"></i> {{ value ? \"Кўриш\" : \"Белгилаш\" }}\n        </b-btn>\n    </BaseControl>\n</template>\n\n<script>\nimport BaseControl from \"@Platon/components/form/controls/BaseControl.vue\"\nimport Btn from \"@Platon/components/extended/Btn.vue\"\nimport InputControlMixin from \"@Platon/mixins/InputControlMixin\"\nimport ValidationMixin from \"@Platon/mixins/ValidationMixin\"\nimport MapPolygonModal from \"@Platon/components/form/controls/MapPolygonModal.vue\"\nimport L from \"leaflet/dist/leaflet\"\n\nwindow.AREA_MEASUREMENTS = {\n    GA: 10000\n}\n\nexport default {\n    name: \"MapPolygonControl\",\n    components: { Btn, BaseControl },\n\n    mixins: [InputControlMixin, ValidationMixin],\n\n    methods: {\n        openPolygonControl() {\n            this.$modal.show(\n                MapPolygonModal,\n                {\n                    value: this.value,\n                    defaultMapCenter: this.item.mapCenter,\n                    defaultMapZoom: this.item.mapZoom,\n                    extraPolygons: this.item.extraPolygons,\n                    extraPolygonStyle: this.item.extraPolygonStyle,\n                    isMultiple: this.isMultiple,\n\n                    onValue: (polygon, area) => {\n                        this.$emit(\"input\", polygon)\n                        this.$parent.$emit(\"area-selected\", area)\n                        this.updateLocal(polygon)\n                    }\n                },\n                { width: \"90%\", height: \"90%\" }\n            )\n        },\n\n        /**\n         * @param measurementScale Default is hector, but you can customize it, if you want in meters, send 1\n         * @param precision\n         * @return {string|number}\n         */\n        getArea(measurementScale = AREA_MEASUREMENTS.GA, precision = 2) {\n            if (this.value && this.value.coordinates) {\n                let totalArea = 0\n\n                for (let coordinateArray of this.value.coordinates) {\n                    const coords = this.formatCoords(coordinateArray)\n                    totalArea += L.GeometryUtil.geodesicArea(coords)\n                }\n\n                if (precision > 0) return (totalArea / measurementScale).toFixed(precision)\n                else return totalArea / measurementScale\n            } else {\n                return 0\n            }\n        },\n\n        /**\n         * @param {array|{lat:number,lng:number}} coords\n         */\n        formatCoords(coords) {\n            if (coords.length > 0) {\n                let first = coords[0]\n\n                if (Array.isArray(first)) {\n                    return coords.map((coord) => {\n                        return {\n                            lat: coord[1],\n                            lng: coord[0]\n                        }\n                    })\n                }\n            }\n\n            return coords\n        }\n    },\n    computed: {\n        isMultiple() {\n            return !!this.item.isMultiple\n        }\n    }\n}\n</script>\n\n<style></style>\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./MapPolygonControl.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./MapPolygonControl.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./MapPolygonControl.vue?vue&type=template&id=487d90ea&\"\nimport script from \"./MapPolygonControl.vue?vue&type=script&lang=js&\"\nexport * from \"./MapPolygonControl.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticStyle:{\"width\":\"100%\",\"border\":\"1px solid #ccc\"},attrs:{\"id\":\"map\"}})}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n    <div id=\"map\" style=\"width: 100%; border: 1px solid #ccc\"></div>\n</template>\n\n<script>\nimport L from \"leaflet/dist/leaflet\"\nimport \"leaflet/dist/leaflet.css\"\n\nimport \"leaflet-draw\"\nimport \"leaflet-draw/dist/leaflet.draw.css\"\nimport { DEFAULT_MAP_CENTER } from \"@Platon/const\"\nimport InputControlMixin from \"@Platon/mixins/InputControlMixin\"\nimport LeafletDrawUz from \"@Platon/external/map/DrawingToolbarUz.js\"\n\nexport default {\n    name: \"MapPolygon\",\n\n    mixins: [InputControlMixin],\n\n    data() {\n        return {\n            drawingLayer: null,\n            externalPolygonLayer: null,\n            map: null,\n            drawing: false\n        }\n    },\n\n    props: {\n        edit: {\n            type: Boolean,\n            default: true\n        },\n        defaultMapCenter: {},\n        defaultMapZoom: {},\n        extraPolygons: {},\n        extraPolygonStyle: {\n            default: () => ({\n                // const exampleStyle = {\n                // \tweight: 2,\n                // \topacity: 1,\n                // \tcolor: 'red',\n                // \tfillOpacity: 0.7,\n                // \tfillColor: 'red'\n                // }\n\n                fillColor: \"rgba(255,0,0,0.35)\",\n                color: \"#ff0000\"\n            })\n        },\n        isMultiple: {\n            type: Boolean,\n            default: false\n        }\n    },\n\n    created() {\n        L.drawLocal = LeafletDrawUz\n    },\n\n    mounted() {\n        this.renderMap()\n    },\n\n    methods: {\n        renderMap() {\n            this.setupMap()\n\n            if (this.edit) this.addDrawingControl()\n\n            this.registerMapEvents()\n            this.renderExternalPolygonFromJson()\n            this.renderPolygonFromInput()\n        },\n\n        getMapCenter() {\n            try {\n                return new L.LatLng(...this.defaultMapCenter.split(\",\"))\n            } catch (e) {\n                return new L.LatLng(...DEFAULT_MAP_CENTER)\n            }\n        },\n\n        getMapZoom() {\n            let zoom = Number(this.defaultMapZoom)\n\n            if (Number.isInteger(zoom)) {\n                return zoom\n            }\n\n            return 13\n        },\n\n        renderPolygonFromJson(geoJson) {\n            let json = new L.GeoJSON(geoJson, {\n                onEachFeature: (feature, layer) => {\n                    layer.addTo(this.drawingLayer)\n                    let seeArea = (L.GeometryUtil.geodesicArea(layer.getLatLngs()[0]) / 10000).toFixed(2)\n                    //console.log(seeArea);\n                    // saveHec(seeArea);\n                }\n            })\n\n            this.map.fitBounds(this.drawingLayer.getBounds())\n        },\n\n        addDrawingControl() {\n            this.map.addControl(\n                new L.Control.Draw({\n                    edit: {\n                        featureGroup: this.drawingLayer,\n                        poly: {\n                            allowIntersection: false\n                        }\n                    },\n                    draw: {\n                        polyline: false,\n                        polygon: {\n                            allowIntersection: false,\n                            showArea: true,\n                            drawError: {\n                                color: \"#b00b00\",\n                                timeout: 1000\n                            },\n                            shapeOptions: {\n                                // color: '#bada55'\n                            }\n                        },\n                        circle: false,\n                        circlemarker: false,\n                        marker: false,\n                        rectangle: false\n                    }\n                })\n            )\n        },\n\n        setupMap() {\n            this.map = new L.Map(\"map\", { center: this.getMapCenter(), zoom: this.getMapZoom() })\n            this.drawingLayer = L.featureGroup().addTo(this.map)\n            this.externalPolygonLayer = L.featureGroup().addTo(this.map)\n\n            let googleSat = L.tileLayer(\"http://{s}.google.com/vt/lyrs=s&x={x}&y={y}&z={z}\", {\n                maxZoom: 20,\n                subdomains: [\"mt0\", \"mt1\", \"mt2\", \"mt3\"],\n                attribution: \"google\"\n            })\n\n            let googleStreets = L.tileLayer(\"http://{s}.google.com/vt/lyrs=m&x={x}&y={y}&z={z}\", {\n                maxZoom: 20,\n                subdomains: [\"mt0\", \"mt1\", \"mt2\", \"mt3\"],\n                attribution: \"google\"\n            })\n\n            let osm = L.tileLayer(\"http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png\", {\n                maxZoom: 18,\n                attribution: '&copy; <a href=\"http://openstreetmap.org/copyright\">OpenStreetMap</a> contributors'\n            })\n\n            L.control\n                .layers(\n                    {\n                        osm: osm.addTo(this.map),\n                        googleSat,\n                        googleStreets\n                    },\n                    {\n                        [this.$l(\"platon.mappolygon.drawinglayer\", \"Чизмалар\")]: this.drawingLayer,\n                        [this.$l(\"platon.mappolygon.externalpolygonlayer\", \"Ташқи чизмалар\")]: this.externalPolygonLayer\n                    },\n                    { position: \"topright\", collapsed: false }\n                )\n                .addTo(this.map)\n        },\n        getVolumeOfShapeByLatLng(latLng) {\n            return +(L.GeometryUtil.geodesicArea(latLng) / 10000).toFixed(2)\n        },\n\n        registerMapEvents() {\n            let map = this.map\n\n            map.on(L.Draw.Event.CREATED, (e) => {\n                if (!this.isMultiple) this.drawingLayer.clearLayers()\n                let type = e.layerType\n                let layer = e.layer\n\n                this.drawingLayer.addLayer(layer)\n                var seeArea = this.getVolumeOfShapeByLatLng(layer.getLatLngs()[0])\n                //console.log(seeArea);\n                this.saveHec(seeArea)\n            })\n\n            map.on(L.Draw.Event.DRAWSTART, (e) => {\n                this.drawing = true\n            })\n\n            map.on(L.Draw.Event.DRAWSTOP, (e) => {\n                this.drawing = false\n                this.emitValue()\n            })\n\n            map.on(L.Draw.Event.EDITSTART, (e) => {\n                this.drawing = true\n            })\n\n            map.on(L.Draw.Event.EDITSTOP, (e) => {\n                this.drawing = false\n                this.emitValue()\n            })\n\n            map.on(L.Draw.Event.DELETED, (e) => {\n                this.drawing = false\n                this.emitValue()\n            })\n\n            map.on(L.Draw.Event.EDITED, (e) => {\n                var layers = e.layers\n                var countOfEditedLayers = 0\n                var seeArea\n                layers.eachLayer((layer) => {\n                    seeArea = (L.GeometryUtil.geodesicArea(layer.getLatLngs()[0]) / 10000).toFixed(2)\n\n                    this.saveHec(seeArea)\n                    countOfEditedLayers++\n                })\n            })\n        },\n\n        renderPolygonFromInput() {\n            if (!this.value) return\n\n            let polygonData = Array.isArray(this.value) ? this.value : [this.value]\n\n            let featureCollection = polygonData.map((p) => {\n                return { type: \"Feature\", properties: {}, geometry: p }\n            })\n\n            let geoJSON = { type: \"FeatureCollection\", features: featureCollection }\n\n            this.drawingLayer.clearLayers()\n            this.renderPolygonFromJson(geoJSON)\n        },\n\n        emitValue() {\n            let geo = this.drawingLayer.toGeoJSON()\n\n            if (Array.isArray(geo.features) && geo.features.length > 0) {\n                let geometry\n\n                if (this.isMultiple) geometry = geo.features.map((f) => f.geometry)\n                else geometry = geo.features[0].geometry\n\n                this.$emit(\"input\", geometry)\n                this.$emit(\"selected-area\", this.getAreaFromSelected())\n            } else {\n                this.$emit(\"input\", null)\n                this.$emit(\"selected-area\", 0)\n            }\n        },\n\n        saveHec(hec) {\n            // console.log(`Area ${hec}`)\n            // saves area\n            // document.getElementById(\"asquare\").value = hec;\n        },\n\n        getAreaFromSelected() {\n            let area = 0\n\n            this.drawingLayer.eachLayer((layer) => {\n                area += this.getVolumeOfShapeByLatLng(layer.getLatLngs()[0])\n            })\n\n            return area\n        },\n\n        renderExternalPolygonFromJson() {\n            const polygons = this.extraPolygons\n\n            if (polygons == null) return\n\n            let geoJSON = { type: \"FeatureCollection\", features: polygons }\n\n            let json = new L.GeoJSON(geoJSON, {\n                style: this.extraPolygonStyle,\n                onEachFeature: (feature, layer) => {\n                    if (feature.label) {\n                        layer.bindTooltip(feature.label, { permanent: true, direction: \"center\" }).openTooltip()\n                    }\n\n                    layer.addTo(this.externalPolygonLayer)\n                }\n            })\n\n            if (!this.value) {\n                this.map.fitBounds(this.externalPolygonLayer.getBounds())\n            }\n        }\n    },\n\n    watch: {\n        value: {\n            handler() {\n                if (this.map != null) {\n                    this.renderPolygonFromInput()\n                }\n            }\n        },\n\n        extraPolygons: {\n            handler() {\n                if (this.map != null) {\n                    this.renderExternalPolygonFromJson()\n                }\n            }\n        },\n\n        drawing(val) {\n            this.$emit(\"drawing\", val)\n        }\n    }\n}\n</script>\n\n<style></style>\n","import mod from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./MapPolygon.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../node_modules/cache-loader/dist/cjs.js??ref--13-0!../../../../node_modules/thread-loader/dist/cjs.js!../../../../node_modules/babel-loader/lib/index.js!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-0!../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./MapPolygon.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./MapPolygon.vue?vue&type=template&id=58cfbf1c&\"\nimport script from \"./MapPolygon.vue?vue&type=script&lang=js&\"\nexport * from \"./MapPolygon.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}