From 2f76193730be4b4f96761932fdace46f83e6b685 Mon Sep 17 00:00:00 2001 From: kaveh Date: Wed, 30 May 2018 13:17:37 -0700 Subject: [PATCH] Add `removeLegend` This method removes an entry from an instance. --- CHANGELOG.md | 3 ++ LICENSE | 2 +- README.md | 4 ++- dist/L.Control.HtmlLegend.js | 2 +- dist/L.Control.HtmlLegend.js.map | 2 +- index.html | 27 ++++++++++---- package.json | 5 +-- src/L.Control.HtmlLegend.js | 61 ++++++++++++++++++++++---------- 8 files changed, 74 insertions(+), 32 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index b930d35..0e00ed4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,6 @@ +0.3.2 (2018-05-30) + * Add `removeLegend` method + 0.3.1 (2018-05-29) * Add `updateOpacity` to `options` - A new method that allows to use a custom function for adjusting layers opacity diff --git a/LICENSE b/LICENSE index e7141e3..caa2baf 100644 --- a/LICENSE +++ b/LICENSE @@ -1,4 +1,4 @@ -Copyright (c) 2016, Conservation Biology Institute +Copyright (c) 2018, Conservation Biology Institute Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above diff --git a/README.md b/README.md index 340cb9f..a9be280 100644 --- a/README.md +++ b/README.md @@ -2,7 +2,7 @@ A simple Leaflet plugin for creating legends with HTML. -*Tested with Leaflet 1.1.0* +*Tested with Leaflet 1.3.x* ## Install @@ -65,6 +65,8 @@ htmlLegend.addLegend({ }) ``` +An existing entry in a legend control instance can be removed using `removeLegend`. This method needs id of the entry, which can be obtained from `htmllegend._entries` (see the example for usage). + See the [example](//consbio.github.io/Leaflet.HtmlLegend) for usage details. diff --git a/dist/L.Control.HtmlLegend.js b/dist/L.Control.HtmlLegend.js index e3cee21..1ce1157 100644 --- a/dist/L.Control.HtmlLegend.js +++ b/dist/L.Control.HtmlLegend.js @@ -1,2 +1,2 @@ -!function(e){function t(n){if(i[n])return i[n].exports;var a=i[n]={i:n,l:!1,exports:{}};return e[n].call(a.exports,a,a.exports,t),a.l=!0,a.exports}var i={};t.m=e,t.c=i,t.d=function(e,i,n){t.o(e,i)||Object.defineProperty(e,i,{configurable:!1,enumerable:!0,get:n})},t.n=function(e){var i=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(i,"a",i),i},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=0)}([function(e,t,i){"use strict";var n=function(){function e(e,t){var i=[],n=!0,a=!1,l=void 0;try{for(var o,r=e[Symbol.iterator]();!(n=(o=r.next()).done)&&(i.push(o.value),!t||i.length!==t);n=!0);}catch(e){a=!0,l=e}finally{try{!n&&r.return&&r.return()}finally{if(a)throw l}}return i}return function(t,i){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return e(t,i);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}();L.Control.HtmlLegend=L.Control.extend({_map:null,_activeLayers:0,_alwaysShow:!1,options:{position:"topright",legends:[],collapseSimple:!1,detectStretched:!1,collapsedOnInit:!1,updateOpacity:null,defaultOpacity:1,visibleIcon:"leaflet-html-legend-icon-eye",hiddenIcon:"leaflet-html-legend-icon-eye-slash",toggleIcon:"leaflet-html-legend-icon-eye"},onAdd:function(e){return this._map=e,this._container=L.DomUtil.create("div","leaflet-control leaflet-bar leaflet-html-legend"),L.DomEvent.disableClickPropagation(this._container),L.DomEvent.disableScrollPropagation(this._container),this.render(),this._container},render:function(){L.DomUtil.empty(this._container),this.options.legends.forEach(this._renderLegend,this),this._checkVisibility()},addLegend:function(e){this.options.legends.push(e),this._map&&this._renderLegend(e)},_renderLegend:function(e){var t=this;if(e.elements){var i=e.elements,n="legend-block";this.options.detectStretched&&3===i.length&&""!==i[0].label&&""===i[1].label&&""!==i[2].label&&(n+=" legend-stretched");var a=L.DomUtil.create("div",n,this._container);if(this.options.collapseSimple&&1===i.length&&!i[0].label)return this._addElement(i[0].html,e.name,i[0].style,a),void this._connectLayer(a,e);if(e.name){var l=L.DomUtil.create("h4",null,a);L.DomUtil.create("div","legend-caret",l),L.DomUtil.create("span",null,l).innerHTML=e.name,this.options.collapsedOnInit&&L.DomUtil.addClass(l,"closed"),L.DomEvent.on(l,"click",function(){L.DomUtil.hasClass(l,"closed")?L.DomUtil.removeClass(l,"closed"):L.DomUtil.addClass(l,"closed")},this)}var o=L.DomUtil.create("div","legend-elements",a);i.forEach(function(e){t._addElement(e.html,e.label,e.style,o)},this),this._connectLayer(a,e)}},_addElement:function(e,t,i,a){var l=L.DomUtil.create("div","legend-row",a),o=L.DomUtil.create("span","symbol",l);i&&Object.entries(i).forEach(function(e){var t=n(e,2),i=t[0],a=t[1];o.style[i]=a}),o.innerHTML=e,t&&(L.DomUtil.create("label",null,l).innerHTML=t)},_updateOpacity:function(e,t){"function"==typeof this.options.updateOpacity?this.options.updateOpacity(e,t):"function"==typeof e.setOpacity?e.setOpacity(t):"function"==typeof e.setStyle&&e.setStyle({opacity:t})},_connectLayer:function(e,t){var i=this,n=t.layer;if(!n)return void(this._alwaysShow=!0);var a=n.opacity||this.options.defaultOpacity||1;this._updateOpacity(n,a),this._map.hasLayer(n)?this._activeLayers+=1:e.style.display="none",e.classList.add("layer-control");var l=L.DomUtil.create("i","visibility-toggle "+this.options.toggleIcon,e);l.dataset.visibileOpacity=a,L.DomEvent.on(l,"click",function(e){var t=e.target;L.DomUtil.hasClass(t,"disabled")?(L.DomUtil.removeClass(t,"disabled"),i._updateOpacity(n,t.dataset.visibileOpacity)):(L.DomUtil.addClass(t,"disabled"),i._updateOpacity(n,0))});var o=L.DomUtil.create("span","opacity-slider",e);L.DomUtil.create("span","slider-label",o).innerHTML="Transparency:",L.DomUtil.create("i",this.options.visibleIcon,o);var r=L.DomUtil.create("input",null,o);r.type="range",r.min=0,r.max=1,r.step=.1,r.onchange=function(e){var t=1-e.target.value||0;i._updateOpacity(n,t),l.dataset.visibileOpacity=t,L.DomUtil.removeClass(l,"disabled")},r.value=1-a,L.DomUtil.create("i",this.options.hiddenIcon,o),this._map.on("layeradd",function(t){t.layer===n&&(i._activeLayers+=1,e.style.display="",i._checkVisibility())}).on("layerremove",function(t){t.layer===n&&(i._activeLayers-=1,e.style.display="none",i._checkVisibility())})},_checkVisibility:function(){this._alwaysShow||this._activeLayers?this._container.style.display="":this._container.style.display="none"}}),L.control.htmllegend=function(e){return new L.Control.HtmlLegend(e)}}]); +!function(e){function t(n){if(i[n])return i[n].exports;var a=i[n]={i:n,l:!1,exports:{}};return e[n].call(a.exports,a,a.exports,t),a.l=!0,a.exports}var i={};t.m=e,t.c=i,t.d=function(e,i,n){t.o(e,i)||Object.defineProperty(e,i,{configurable:!1,enumerable:!0,get:n})},t.n=function(e){var i=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(i,"a",i),i},t.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},t.p="",t(t.s=0)}([function(e,t,i){"use strict";var n=function(){function e(e,t){var i=[],n=!0,a=!1,l=void 0;try{for(var o,r=e[Symbol.iterator]();!(n=(o=r.next()).done)&&(i.push(o.value),!t||i.length!==t);n=!0);}catch(e){a=!0,l=e}finally{try{!n&&r.return&&r.return()}finally{if(a)throw l}}return i}return function(t,i){if(Array.isArray(t))return t;if(Symbol.iterator in Object(t))return e(t,i);throw new TypeError("Invalid attempt to destructure non-iterable instance")}}();L.Control.HtmlLegend=L.Control.extend({_map:null,_activeLayers:0,_alwaysShow:!1,options:{position:"topright",legends:[],collapseSimple:!1,detectStretched:!1,collapsedOnInit:!1,updateOpacity:null,defaultOpacity:1,visibleIcon:"leaflet-html-legend-icon-eye",hiddenIcon:"leaflet-html-legend-icon-eye-slash",toggleIcon:"leaflet-html-legend-icon-eye"},onAdd:function(e){return this._map=e,this._container=L.DomUtil.create("div","leaflet-control leaflet-bar leaflet-html-legend"),this._lastId=0,this._entries={},L.DomEvent.disableClickPropagation(this._container),L.DomEvent.disableScrollPropagation(this._container),this.render(),this._container},render:function(){var e=this;L.DomUtil.empty(this._container),this.options.legends.forEach(function(t){return e._renderLegend(t)},this),this._checkVisibility()},addLegend:function(e){this._map&&this._renderLegend(e)},removeLegend:function(e){var t=this._entries[e];t&&(t.layer&&t.events&&Object.entries(t.events).forEach(function(e){var i=n(e,2),a=i[0],l=i[1];return t.layer.off(a,l)}),L.DomUtil.remove(this._entries[e].container),delete this._entries[e])},_renderLegend:function(e){var t=this;if(e.elements){var i=e.elements,n="legend-block";this.options.detectStretched&&3===i.length&&""!==i[0].label&&""===i[1].label&&""!==i[2].label&&(n+=" legend-stretched");var a=L.DomUtil.create("div",n,this._container),l=++this._lastId;if(this._entries[l]={container:a},this.options.collapseSimple&&1===i.length&&!i[0].label)return this._addElement(i[0].html,e.name,i[0].style,a),this._connectLayer(a,e,l),a;if(e.name){var o=L.DomUtil.create("h4",null,a);L.DomUtil.create("div","legend-caret",o),L.DomUtil.create("span",null,o).innerHTML=e.name,this.options.collapsedOnInit&&L.DomUtil.addClass(o,"closed"),L.DomEvent.on(o,"click",function(){L.DomUtil.hasClass(o,"closed")?L.DomUtil.removeClass(o,"closed"):L.DomUtil.addClass(o,"closed")},this)}var r=L.DomUtil.create("div","legend-elements",a);return i.forEach(function(e){t._addElement(e.html,e.label,e.style,r)},this),this._connectLayer(a,e,l),a}},_addElement:function(e,t,i,a){var l=L.DomUtil.create("div","legend-row",a),o=L.DomUtil.create("span","symbol",l);i&&Object.entries(i).forEach(function(e){var t=n(e,2),i=t[0],a=t[1];o.style[i]=a}),o.innerHTML=e,t&&(L.DomUtil.create("label",null,l).innerHTML=t)},_updateOpacity:function(e,t){"function"==typeof this.options.updateOpacity?this.options.updateOpacity(e,t):"function"==typeof e.setOpacity?e.setOpacity(t):"function"==typeof e.setStyle&&e.setStyle({opacity:t})},_layerAdd:function(e){this._activeLayers+=1,e.style.display="",this._checkVisibility()},_layerRemove:function(e){this._activeLayers-=1,e.style.display="none",this._checkVisibility()},_connectLayer:function(e,t,i){var n=this,a=t.layer;if(!a)return void(this._alwaysShow=!0);var l=a.opacity||this.options.defaultOpacity||1;this._updateOpacity(a,l),this._map.hasLayer(a)?this._activeLayers+=1:e.style.display="none",e.classList.add("layer-control");var o=L.DomUtil.create("i","visibility-toggle "+this.options.toggleIcon,e);o.dataset.visibileOpacity=l,L.DomEvent.on(o,"click",function(e){var t=e.target;L.DomUtil.hasClass(t,"disabled")?(L.DomUtil.removeClass(t,"disabled"),n._updateOpacity(a,t.dataset.visibileOpacity)):(L.DomUtil.addClass(t,"disabled"),n._updateOpacity(a,0))});var r=L.DomUtil.create("span","opacity-slider",e);L.DomUtil.create("span","slider-label",r).innerHTML="Transparency:",L.DomUtil.create("i",this.options.visibleIcon,r);var s=L.DomUtil.create("input",null,r);s.type="range",s.min=0,s.max=1,s.step=.1,s.onchange=function(e){var t=1-e.target.value||0;n._updateOpacity(a,t),o.dataset.visibileOpacity=t,L.DomUtil.removeClass(o,"disabled")},s.value=1-l,L.DomUtil.create("i",this.options.hiddenIcon,r);var c=this._layerAdd.bind(this,e),d=this._layerRemove.bind(this,e);a.on("add",c).on("remove",d),this._entries[i].layer=a,this._entries[i].events={add:c,remove:d}},_checkVisibility:function(){this._alwaysShow||this._activeLayers?this._container.style.display="":this._container.style.display="none"}}),L.control.htmllegend=function(e){return new L.Control.HtmlLegend(e)}}]); //# sourceMappingURL=L.Control.HtmlLegend.js.map \ No newline at end of file diff --git a/dist/L.Control.HtmlLegend.js.map b/dist/L.Control.HtmlLegend.js.map index c362948..4ef9a4c 100644 --- a/dist/L.Control.HtmlLegend.js.map +++ b/dist/L.Control.HtmlLegend.js.map @@ -1 +1 @@ -{"version":3,"sources":["webpack:///L.Control.HtmlLegend.js","webpack:///webpack/bootstrap c8cc31aa518badf77e48","webpack:///./src/L.Control.HtmlLegend.js"],"names":["modules","__webpack_require__","moduleId","installedModules","exports","module","i","l","call","m","c","d","name","getter","o","Object","defineProperty","configurable","enumerable","get","n","__esModule","object","property","prototype","hasOwnProperty","p","s","_slicedToArray","sliceIterator","arr","_arr","_n","_d","_e","undefined","_s","_i","Symbol","iterator","next","done","push","value","length","err","Array","isArray","TypeError","L","Control","HtmlLegend","extend","_map","_activeLayers","_alwaysShow","options","position","legends","collapseSimple","detectStretched","collapsedOnInit","updateOpacity","defaultOpacity","visibleIcon","hiddenIcon","toggleIcon","onAdd","map","this","_container","DomUtil","create","DomEvent","disableClickPropagation","disableScrollPropagation","render","empty","forEach","_renderLegend","_checkVisibility","addLegend","legend","_this","elements","className","label","block","_addElement","html","style","_connectLayer","header","innerHTML","addClass","on","hasClass","removeClass","elementContainer","element","container","row","symbol","entries","_ref","_ref2","k","v","_updateOpacity","layer","opacity","setOpacity","setStyle","_this2","hasLayer","display","classList","add","toggleButton","dataset","visibileOpacity","e","button","target","opacityController","opacitySlider","type","min","max","step","onchange","newOpacity","control","htmllegend"],"mappings":"CAAS,SAAUA,GCInB,QAAAC,GAAAC,GAGA,GAAAC,EAAAD,GACA,MAAAC,GAAAD,GAAAE,OAGA,IAAAC,GAAAF,EAAAD,IACAI,EAAAJ,EACAK,GAAA,EACAH,WAUA,OANAJ,GAAAE,GAAAM,KAAAH,EAAAD,QAAAC,IAAAD,QAAAH,GAGAI,EAAAE,GAAA,EAGAF,EAAAD,QAvBA,GAAAD,KA4BAF,GAAAQ,EAAAT,EAGAC,EAAAS,EAAAP,EAGAF,EAAAU,EAAA,SAAAP,EAAAQ,EAAAC,GACAZ,EAAAa,EAAAV,EAAAQ,IACAG,OAAAC,eAAAZ,EAAAQ,GACAK,cAAA,EACAC,YAAA,EACAC,IAAAN,KAMAZ,EAAAmB,EAAA,SAAAf,GACA,GAAAQ,GAAAR,KAAAgB,WACA,WAA2B,MAAAhB,GAAA,SAC3B,WAAiC,MAAAA,GAEjC,OADAJ,GAAAU,EAAAE,EAAA,IAAAA,GACAA,GAIAZ,EAAAa,EAAA,SAAAQ,EAAAC,GAAsD,MAAAR,QAAAS,UAAAC,eAAAjB,KAAAc,EAAAC,IAGtDtB,EAAAyB,EAAA,GAGAzB,IAAA0B,EAAA,KDMM,SAAUtB,EAAQD,EAASH,GAEjC,YAGA,IAAI2B,GAAiB,WAAc,QAASC,GAAcC,EAAKxB,GAAK,GAAIyB,MAAeC,GAAK,EAAUC,GAAK,EAAWC,MAAKC,EAAW,KAAM,IAAK,GAAiCC,GAA7BC,EAAKP,EAAIQ,OAAOC,cAAmBP,GAAMI,EAAKC,EAAGG,QAAQC,QAAoBV,EAAKW,KAAKN,EAAGO,QAAYrC,GAAKyB,EAAKa,SAAWtC,GAA3D0B,GAAK,IAAoE,MAAOa,GAAOZ,GAAK,EAAMC,EAAKW,EAAO,QAAU,KAAWb,GAAMK,EAAW,QAAGA,EAAW,SAAO,QAAU,GAAIJ,EAAI,KAAMC,IAAQ,MAAOH,GAAQ,MAAO,UAAUD,EAAKxB,GAAK,GAAIwC,MAAMC,QAAQjB,GAAQ,MAAOA,EAAY,IAAIQ,OAAOC,WAAYxB,QAAOe,GAAQ,MAAOD,GAAcC,EAAKxB,EAAa,MAAM,IAAI0C,WAAU,2DExEtlBC,GAAEC,QAAQC,WAAaF,EAAEC,QAAQE,QAC7BC,KAAM,KACNC,cAAe,EACfC,aAAa,EACbC,SACIC,SAAU,WAGVC,WAGAC,gBAAgB,EAGhBC,iBAAiB,EAGjBC,iBAAiB,EAEjBC,cAAe,KACfC,eAAgB,EAChBC,YAAa,+BACbC,WAAY,qCACZC,WAAY,gCAGhBC,MA1BoC,SA0B9BC,GAUF,MATAC,MAAKhB,KAAOe,EACZC,KAAKC,WAAarB,EAAEsB,QAAQC,OAAO,MAAO,mDAG1CvB,EAAEwB,SAASC,wBAAwBL,KAAKC,YACxCrB,EAAEwB,SAASE,yBAAyBN,KAAKC,YAEzCD,KAAKO,SAEEP,KAAKC,YAGhBM,OAvCoC,WAwChC3B,EAAEsB,QAAQM,MAAMR,KAAKC,YAErBD,KAAKb,QAAQE,QAAQoB,QAAQT,KAAKU,cAAeV,MAEjDA,KAAKW,oBAGTC,UA/CoC,SA+C1BC,GACNb,KAAKb,QAAQE,QAAQhB,KAAKwC,GACtBb,KAAKhB,MACLgB,KAAKU,cAAcG,IAI3BH,cAtDoC,SAsDtBG,GAAQ,GAAAC,GAAAd,IAClB,IAAKa,EAAOE,SAAZ,CAIA,GAAMA,GAAWF,EAAOE,SAEpBC,EAAY,cAEZhB,MAAKb,QAAQI,iBAEW,IAApBwB,EAASxC,QACa,KAAtBwC,EAAS,GAAGE,OACU,KAAtBF,EAAS,GAAGE,OACU,KAAtBF,EAAS,GAAGE,QAEZD,GAAa,oBAIrB,IAAME,GAAQtC,EAAEsB,QAAQC,OAAO,MAAOa,EAAWhB,KAAKC,WAEtD,IAAID,KAAKb,QAAQG,gBAAsC,IAApByB,EAASxC,SAAiBwC,EAAS,GAAGE,MAGrE,MAFAjB,MAAKmB,YAAYJ,EAAS,GAAGK,KAAMP,EAAOtE,KAAMwE,EAAS,GAAGM,MAAOH,OACnElB,MAAKsB,cAAcJ,EAAOL,EAI9B,IAAIA,EAAOtE,KAAM,CACb,GAAMgF,GAAS3C,EAAEsB,QAAQC,OAAO,KAAM,KAAMe,EAC5CtC,GAAEsB,QAAQC,OAAO,MAAO,eAAgBoB,GACxC3C,EAAEsB,QAAQC,OAAO,OAAQ,KAAMoB,GAAQC,UAAYX,EAAOtE,KAEtDyD,KAAKb,QAAQK,iBACbZ,EAAEsB,QAAQuB,SAASF,EAAQ,UAG/B3C,EAAEwB,SAASsB,GAAGH,EAAQ,QAAS,WACvB3C,EAAEsB,QAAQyB,SAASJ,EAAQ,UAC3B3C,EAAEsB,QAAQ0B,YAAYL,EAAQ,UAG9B3C,EAAEsB,QAAQuB,SAASF,EAAQ,WAEhCvB,MAGP,GAAM6B,GAAmBjD,EAAEsB,QAAQC,OAAO,MAAO,kBAAmBe,EAEpEH,GAASN,QAAQ,SAACqB,GACdhB,EAAKK,YAAYW,EAAQV,KAAMU,EAAQb,MAAOa,EAAQT,MAAOQ,IAC9D7B,MAEHA,KAAKsB,cAAcJ,EAAOL,KAG9BM,YA9GoC,SA8GxBC,EAAMH,EAAOI,EAAOU,GAC5B,GAAMC,GAAMpD,EAAEsB,QAAQC,OAAO,MAAO,aAAc4B,GAC5CE,EAASrD,EAAEsB,QAAQC,OAAO,OAAQ,SAAU6B,EAC9CX,IACA3E,OAAOwF,QAAQb,GAAOZ,QAAQ,SAAA0B,GAAY,GAAAC,GAAA7E,EAAA4E,EAAA,GAAVE,EAAUD,EAAA,GAAPE,EAAOF,EAAA,EAAEH,GAAOZ,MAAMgB,GAAKC,IAElEL,EAAOT,UAAYJ,EACfH,IACArC,EAAEsB,QAAQC,OAAO,QAAS,KAAM6B,GAAKR,UAAYP,IAIzDsB,eA1HoC,SA0HrBC,EAAOC,GACwB,kBAA/BzC,MAAKb,QAAQM,cACpBO,KAAKb,QAAQM,cAAc+C,EAAOC,GACC,kBAArBD,GAAME,WACpBF,EAAME,WAAWD,GACgB,kBAAnBD,GAAMG,UACpBH,EAAMG,UAAWF,aAIzBnB,cApIoC,SAoItBS,EAAWlB,GAAQ,GAAA+B,GAAA5C,KACvBwC,EAAQ3B,EAAO2B,KAErB,KAAKA,EAED,YADAxC,KAAKd,aAAc,EAIvB,IAAMuD,GAAUD,EAAMC,SAAWzC,KAAKb,QAAQO,gBAAkB,CAChEM,MAAKuC,eAAeC,EAAOC,GAEvBzC,KAAKhB,KAAK6D,SAASL,GACnBxC,KAAKf,eAAiB,EAGtB8C,EAAUV,MAAMyB,QAAU,OAG9Bf,EAAUgB,UAAUC,IAAI,gBAExB,IAAMC,GAAerE,EAAEsB,QAAQC,OAAO,IAAjB,qBAA2CH,KAAKb,QAAQU,WAAckC,EAC3FkB,GAAaC,QAAQC,gBAAkBV,EACvC7D,EAAEwB,SAASsB,GAAGuB,EAAc,QAAS,SAACG,GAClC,GAAMC,GAASD,EAAEE,MACb1E,GAAEsB,QAAQyB,SAAS0B,EAAQ,aAC3BzE,EAAEsB,QAAQ0B,YAAYyB,EAAQ,YAC9BT,EAAKL,eAAeC,EAAOa,EAAOH,QAAQC,mBAG1CvE,EAAEsB,QAAQuB,SAAS4B,EAAQ,YAC3BT,EAAKL,eAAeC,EAAO,KAInC,IAAMe,GAAoB3E,EAAEsB,QAAQC,OAAO,OAAQ,iBAAkB4B,EAErEnD,GAAEsB,QAAQC,OAAO,OAAQ,eAAgBoD,GAAmB/B,UAAY,gBAExE5C,EAAEsB,QAAQC,OAAO,IAAKH,KAAKb,QAAQQ,YAAa4D,EAEhD,IAAMC,GAAgB5E,EAAEsB,QAAQC,OAAO,QAAS,KAAMoD,EACtDC,GAAcC,KAAO,QACrBD,EAAcE,IAAM,EACpBF,EAAcG,IAAM,EACpBH,EAAcI,KAAO,GACrBJ,EAAcK,SAAY,SAACT,GACvB,GAAMU,GAAa,EAAIV,EAAEE,OAAOhF,OAAS,CACzCsE,GAAKL,eAAeC,EAAOsB,GAC3Bb,EAAaC,QAAQC,gBAAkBW,EACvClF,EAAEsB,QAAQ0B,YAAYqB,EAAc,aAExCO,EAAclF,MAAQ,EAAKmE,EAE3B7D,EAAEsB,QAAQC,OAAO,IAAKH,KAAKb,QAAQS,WAAY2D,GAE/CvD,KAAKhB,KAAK0C,GAAG,WAAY,SAAC0B,GAClBA,EAAEZ,QAAUA,IACZI,EAAK3D,eAAiB,EACtB8C,EAAUV,MAAMyB,QAAU,GAC1BF,EAAKjC,sBAEVe,GAAG,cAAe,SAAC0B,GACdA,EAAEZ,QAAUA,IACZI,EAAK3D,eAAiB,EACtB8C,EAAUV,MAAMyB,QAAU,OAC1BF,EAAKjC,uBAKjBA,iBA1MoC,WA2M5BX,KAAKd,aAAec,KAAKf,cACzBe,KAAKC,WAAWoB,MAAMyB,QAAU,GAGhC9C,KAAKC,WAAWoB,MAAMyB,QAAU,UAK5ClE,EAAEmF,QAAQC,WAAa,SAAA7E,GAAA,MAAW,IAAIP,GAAEC,QAAQC,WAAWK","file":"L.Control.HtmlLegend.js","sourcesContent":["/******/ (function(modules) { // webpackBootstrap\n/******/ \t// The module cache\n/******/ \tvar installedModules = {};\n/******/\n/******/ \t// The require function\n/******/ \tfunction __webpack_require__(moduleId) {\n/******/\n/******/ \t\t// Check if module is in cache\n/******/ \t\tif(installedModules[moduleId]) {\n/******/ \t\t\treturn installedModules[moduleId].exports;\n/******/ \t\t}\n/******/ \t\t// Create a new module (and put it into the cache)\n/******/ \t\tvar module = installedModules[moduleId] = {\n/******/ \t\t\ti: moduleId,\n/******/ \t\t\tl: false,\n/******/ \t\t\texports: {}\n/******/ \t\t};\n/******/\n/******/ \t\t// Execute the module function\n/******/ \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n/******/\n/******/ \t\t// Flag the module as loaded\n/******/ \t\tmodule.l = true;\n/******/\n/******/ \t\t// Return the exports of the module\n/******/ \t\treturn module.exports;\n/******/ \t}\n/******/\n/******/\n/******/ \t// expose the modules object (__webpack_modules__)\n/******/ \t__webpack_require__.m = modules;\n/******/\n/******/ \t// expose the module cache\n/******/ \t__webpack_require__.c = installedModules;\n/******/\n/******/ \t// define getter function for harmony exports\n/******/ \t__webpack_require__.d = function(exports, name, getter) {\n/******/ \t\tif(!__webpack_require__.o(exports, name)) {\n/******/ \t\t\tObject.defineProperty(exports, name, {\n/******/ \t\t\t\tconfigurable: false,\n/******/ \t\t\t\tenumerable: true,\n/******/ \t\t\t\tget: getter\n/******/ \t\t\t});\n/******/ \t\t}\n/******/ \t};\n/******/\n/******/ \t// getDefaultExport function for compatibility with non-harmony modules\n/******/ \t__webpack_require__.n = function(module) {\n/******/ \t\tvar getter = module && module.__esModule ?\n/******/ \t\t\tfunction getDefault() { return module['default']; } :\n/******/ \t\t\tfunction getModuleExports() { return module; };\n/******/ \t\t__webpack_require__.d(getter, 'a', getter);\n/******/ \t\treturn getter;\n/******/ \t};\n/******/\n/******/ \t// Object.prototype.hasOwnProperty.call\n/******/ \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n/******/\n/******/ \t// __webpack_public_path__\n/******/ \t__webpack_require__.p = \"\";\n/******/\n/******/ \t// Load entry module and return exports\n/******/ \treturn __webpack_require__(__webpack_require__.s = 0);\n/******/ })\n/************************************************************************/\n/******/ ([\n/* 0 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nvar _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"]) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError(\"Invalid attempt to destructure non-iterable instance\"); } }; }();\n\nL.Control.HtmlLegend = L.Control.extend({\n _map: null,\n _activeLayers: 0,\n _alwaysShow: false,\n options: {\n position: 'topright',\n\n // array of legend entries - see README for format\n legends: [],\n\n // if true, legend entries that are from a simple renderer will use compact presentation\n collapseSimple: false,\n\n // if true, will test to see if legend entries look stretched; these are usually in sets of 3 with the middle element having no label\n detectStretched: false,\n\n // if true, legends will be collapsed when a new instance is initialized\n collapsedOnInit: false,\n\n updateOpacity: null,\n defaultOpacity: 1,\n visibleIcon: 'leaflet-html-legend-icon-eye',\n hiddenIcon: 'leaflet-html-legend-icon-eye-slash',\n toggleIcon: 'leaflet-html-legend-icon-eye'\n },\n\n onAdd: function onAdd(map) {\n this._map = map;\n this._container = L.DomUtil.create('div', 'leaflet-control leaflet-bar leaflet-html-legend');\n\n // Disable events on container\n L.DomEvent.disableClickPropagation(this._container);\n L.DomEvent.disableScrollPropagation(this._container);\n\n this.render();\n\n return this._container;\n },\n render: function render() {\n L.DomUtil.empty(this._container);\n\n this.options.legends.forEach(this._renderLegend, this);\n\n this._checkVisibility();\n },\n addLegend: function addLegend(legend) {\n this.options.legends.push(legend);\n if (this._map) {\n this._renderLegend(legend);\n }\n },\n _renderLegend: function _renderLegend(legend) {\n var _this = this;\n\n if (!legend.elements) {\n return;\n }\n\n var elements = legend.elements;\n\n var className = 'legend-block';\n\n if (this.options.detectStretched) {\n if (elements.length === 3 && elements[0].label !== '' && elements[1].label === '' && elements[2].label !== '') {\n className += ' legend-stretched';\n }\n }\n\n var block = L.DomUtil.create('div', className, this._container);\n\n if (this.options.collapseSimple && elements.length === 1 && !elements[0].label) {\n this._addElement(elements[0].html, legend.name, elements[0].style, block);\n this._connectLayer(block, legend);\n return;\n }\n\n if (legend.name) {\n var header = L.DomUtil.create('h4', null, block);\n L.DomUtil.create('div', 'legend-caret', header);\n L.DomUtil.create('span', null, header).innerHTML = legend.name;\n\n if (this.options.collapsedOnInit) {\n L.DomUtil.addClass(header, 'closed');\n }\n\n L.DomEvent.on(header, 'click', function () {\n if (L.DomUtil.hasClass(header, 'closed')) {\n L.DomUtil.removeClass(header, 'closed');\n } else {\n L.DomUtil.addClass(header, 'closed');\n }\n }, this);\n }\n\n var elementContainer = L.DomUtil.create('div', 'legend-elements', block);\n\n elements.forEach(function (element) {\n _this._addElement(element.html, element.label, element.style, elementContainer);\n }, this);\n\n this._connectLayer(block, legend);\n },\n _addElement: function _addElement(html, label, style, container) {\n var row = L.DomUtil.create('div', 'legend-row', container);\n var symbol = L.DomUtil.create('span', 'symbol', row);\n if (style) {\n Object.entries(style).forEach(function (_ref) {\n var _ref2 = _slicedToArray(_ref, 2),\n k = _ref2[0],\n v = _ref2[1];\n\n symbol.style[k] = v;\n });\n }\n symbol.innerHTML = html;\n if (label) {\n L.DomUtil.create('label', null, row).innerHTML = label;\n }\n },\n _updateOpacity: function _updateOpacity(layer, opacity) {\n if (typeof this.options.updateOpacity === 'function') {\n this.options.updateOpacity(layer, opacity);\n } else if (typeof layer.setOpacity === 'function') {\n layer.setOpacity(opacity);\n } else if (typeof layer.setStyle === 'function') {\n layer.setStyle({ opacity: opacity });\n }\n },\n _connectLayer: function _connectLayer(container, legend) {\n var _this2 = this;\n\n var layer = legend.layer;\n\n if (!layer) {\n this._alwaysShow = true;\n return;\n }\n\n var opacity = layer.opacity || this.options.defaultOpacity || 1;\n this._updateOpacity(layer, opacity);\n\n if (this._map.hasLayer(layer)) {\n this._activeLayers += 1;\n } else {\n container.style.display = 'none';\n }\n\n container.classList.add('layer-control');\n\n var toggleButton = L.DomUtil.create('i', 'visibility-toggle ' + this.options.toggleIcon, container);\n toggleButton.dataset.visibileOpacity = opacity;\n L.DomEvent.on(toggleButton, 'click', function (e) {\n var button = e.target;\n if (L.DomUtil.hasClass(button, 'disabled')) {\n L.DomUtil.removeClass(button, 'disabled');\n _this2._updateOpacity(layer, button.dataset.visibileOpacity);\n } else {\n L.DomUtil.addClass(button, 'disabled');\n _this2._updateOpacity(layer, 0);\n }\n });\n\n var opacityController = L.DomUtil.create('span', 'opacity-slider', container);\n\n L.DomUtil.create('span', 'slider-label', opacityController).innerHTML = 'Transparency:';\n\n L.DomUtil.create('i', this.options.visibleIcon, opacityController);\n\n var opacitySlider = L.DomUtil.create('input', null, opacityController);\n opacitySlider.type = 'range';\n opacitySlider.min = 0;\n opacitySlider.max = 1;\n opacitySlider.step = 0.1;\n opacitySlider.onchange = function (e) {\n var newOpacity = 1 - e.target.value || 0;\n _this2._updateOpacity(layer, newOpacity);\n toggleButton.dataset.visibileOpacity = newOpacity;\n L.DomUtil.removeClass(toggleButton, 'disabled');\n };\n opacitySlider.value = 1 - opacity;\n\n L.DomUtil.create('i', this.options.hiddenIcon, opacityController);\n\n this._map.on('layeradd', function (e) {\n if (e.layer === layer) {\n _this2._activeLayers += 1;\n container.style.display = '';\n _this2._checkVisibility();\n }\n }).on('layerremove', function (e) {\n if (e.layer === layer) {\n _this2._activeLayers -= 1;\n container.style.display = 'none';\n _this2._checkVisibility();\n }\n });\n },\n _checkVisibility: function _checkVisibility() {\n if (this._alwaysShow || this._activeLayers) {\n this._container.style.display = '';\n } else {\n this._container.style.display = 'none';\n }\n }\n});\n\nL.control.htmllegend = function (options) {\n return new L.Control.HtmlLegend(options);\n};\n\n/***/ })\n/******/ ]);\n\n\n// WEBPACK FOOTER //\n// L.Control.HtmlLegend.js"," \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = 0);\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap c8cc31aa518badf77e48","L.Control.HtmlLegend = L.Control.extend({\n _map: null,\n _activeLayers: 0,\n _alwaysShow: false,\n options: {\n position: 'topright',\n\n // array of legend entries - see README for format\n legends: [],\n\n // if true, legend entries that are from a simple renderer will use compact presentation\n collapseSimple: false,\n\n // if true, will test to see if legend entries look stretched; these are usually in sets of 3 with the middle element having no label\n detectStretched: false,\n\n // if true, legends will be collapsed when a new instance is initialized\n collapsedOnInit: false,\n\n updateOpacity: null,\n defaultOpacity: 1,\n visibleIcon: 'leaflet-html-legend-icon-eye',\n hiddenIcon: 'leaflet-html-legend-icon-eye-slash',\n toggleIcon: 'leaflet-html-legend-icon-eye'\n },\n\n onAdd(map) {\n this._map = map;\n this._container = L.DomUtil.create('div', 'leaflet-control leaflet-bar leaflet-html-legend');\n\n // Disable events on container\n L.DomEvent.disableClickPropagation(this._container);\n L.DomEvent.disableScrollPropagation(this._container);\n\n this.render();\n\n return this._container;\n },\n\n render() {\n L.DomUtil.empty(this._container);\n\n this.options.legends.forEach(this._renderLegend, this);\n\n this._checkVisibility();\n },\n\n addLegend(legend) {\n this.options.legends.push(legend);\n if (this._map) {\n this._renderLegend(legend);\n }\n },\n\n _renderLegend(legend) {\n if (!legend.elements) {\n return;\n }\n\n const elements = legend.elements;\n\n let className = 'legend-block';\n\n if (this.options.detectStretched) {\n if (\n elements.length === 3 &&\n elements[0].label !== '' &&\n elements[1].label === '' &&\n elements[2].label !== ''\n ) {\n className += ' legend-stretched';\n }\n }\n\n const block = L.DomUtil.create('div', className, this._container);\n\n if (this.options.collapseSimple && elements.length === 1 && !elements[0].label) {\n this._addElement(elements[0].html, legend.name, elements[0].style, block);\n this._connectLayer(block, legend);\n return;\n }\n\n if (legend.name) {\n const header = L.DomUtil.create('h4', null, block);\n L.DomUtil.create('div', 'legend-caret', header);\n L.DomUtil.create('span', null, header).innerHTML = legend.name;\n\n if (this.options.collapsedOnInit) {\n L.DomUtil.addClass(header, 'closed');\n }\n\n L.DomEvent.on(header, 'click', () => {\n if (L.DomUtil.hasClass(header, 'closed')) {\n L.DomUtil.removeClass(header, 'closed');\n }\n else {\n L.DomUtil.addClass(header, 'closed');\n }\n }, this);\n }\n\n const elementContainer = L.DomUtil.create('div', 'legend-elements', block);\n\n elements.forEach((element) => {\n this._addElement(element.html, element.label, element.style, elementContainer);\n }, this);\n\n this._connectLayer(block, legend);\n },\n\n _addElement(html, label, style, container) {\n const row = L.DomUtil.create('div', 'legend-row', container);\n const symbol = L.DomUtil.create('span', 'symbol', row);\n if (style) {\n Object.entries(style).forEach(([k, v]) => { symbol.style[k] = v; });\n }\n symbol.innerHTML = html;\n if (label) {\n L.DomUtil.create('label', null, row).innerHTML = label;\n }\n },\n\n _updateOpacity(layer, opacity) {\n if (typeof this.options.updateOpacity === 'function') {\n this.options.updateOpacity(layer, opacity)\n } else if (typeof layer.setOpacity === 'function') {\n layer.setOpacity(opacity);\n } else if (typeof layer.setStyle === 'function') {\n layer.setStyle({ opacity });\n }\n },\n\n _connectLayer(container, legend) {\n const layer = legend.layer;\n\n if (!layer) {\n this._alwaysShow = true;\n return;\n }\n\n const opacity = layer.opacity || this.options.defaultOpacity || 1;\n this._updateOpacity(layer, opacity);\n\n if (this._map.hasLayer(layer)) {\n this._activeLayers += 1;\n }\n else {\n container.style.display = 'none';\n }\n\n container.classList.add('layer-control');\n\n const toggleButton = L.DomUtil.create('i', `visibility-toggle ${this.options.toggleIcon}`, container);\n toggleButton.dataset.visibileOpacity = opacity;\n L.DomEvent.on(toggleButton, 'click', (e) => {\n const button = e.target;\n if (L.DomUtil.hasClass(button, 'disabled')) {\n L.DomUtil.removeClass(button, 'disabled');\n this._updateOpacity(layer, button.dataset.visibileOpacity);\n }\n else {\n L.DomUtil.addClass(button, 'disabled');\n this._updateOpacity(layer, 0);\n }\n });\n\n const opacityController = L.DomUtil.create('span', 'opacity-slider', container);\n\n L.DomUtil.create('span', 'slider-label', opacityController).innerHTML = 'Transparency:';\n\n L.DomUtil.create('i', this.options.visibleIcon, opacityController);\n\n const opacitySlider = L.DomUtil.create('input', null, opacityController);\n opacitySlider.type = 'range';\n opacitySlider.min = 0;\n opacitySlider.max = 1;\n opacitySlider.step = 0.1;\n opacitySlider.onchange = ((e) => {\n const newOpacity = 1 - e.target.value || 0;\n this._updateOpacity(layer, newOpacity);\n toggleButton.dataset.visibileOpacity = newOpacity;\n L.DomUtil.removeClass(toggleButton, 'disabled');\n });\n opacitySlider.value = 1 - (opacity);\n\n L.DomUtil.create('i', this.options.hiddenIcon, opacityController);\n\n this._map.on('layeradd', (e) => {\n if (e.layer === layer) {\n this._activeLayers += 1;\n container.style.display = '';\n this._checkVisibility();\n }\n }).on('layerremove', (e) => {\n if (e.layer === layer) {\n this._activeLayers -= 1;\n container.style.display = 'none';\n this._checkVisibility();\n }\n });\n },\n\n _checkVisibility() {\n if (this._alwaysShow || this._activeLayers) {\n this._container.style.display = '';\n }\n else {\n this._container.style.display = 'none';\n }\n }\n});\n\nL.control.htmllegend = options => new L.Control.HtmlLegend(options);\n\n\n\n// WEBPACK FOOTER //\n// ./src/L.Control.HtmlLegend.js"],"sourceRoot":""} \ No newline at end of file +{"version":3,"sources":["webpack:///L.Control.HtmlLegend.js","webpack:///webpack/bootstrap 3c46211c0f65a01ce4a2","webpack:///./src/L.Control.HtmlLegend.js"],"names":["modules","__webpack_require__","moduleId","installedModules","exports","module","i","l","call","m","c","d","name","getter","o","Object","defineProperty","configurable","enumerable","get","n","__esModule","object","property","prototype","hasOwnProperty","p","s","_slicedToArray","sliceIterator","arr","_arr","_n","_d","_e","undefined","_s","_i","Symbol","iterator","next","done","push","value","length","err","Array","isArray","TypeError","L","Control","HtmlLegend","extend","_map","_activeLayers","_alwaysShow","options","position","legends","collapseSimple","detectStretched","collapsedOnInit","updateOpacity","defaultOpacity","visibleIcon","hiddenIcon","toggleIcon","onAdd","map","this","_container","DomUtil","create","_lastId","_entries","DomEvent","disableClickPropagation","disableScrollPropagation","render","_this","empty","forEach","legend","_renderLegend","_checkVisibility","addLegend","removeLegend","itemIdx","entry","layer","events","entries","_ref","_ref2","event","handler","off","remove","container","_this2","elements","className","label","block","entryIdx","_addElement","html","style","_connectLayer","header","innerHTML","addClass","on","hasClass","removeClass","elementContainer","element","row","symbol","_ref3","_ref4","k","v","_updateOpacity","opacity","setOpacity","setStyle","_layerAdd","display","_layerRemove","_this3","hasLayer","classList","add","toggleButton","dataset","visibileOpacity","e","button","target","opacityController","opacitySlider","type","min","max","step","onchange","newOpacity","layerAdd","bind","layerRemove","control","htmllegend"],"mappings":"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","file":"L.Control.HtmlLegend.js","sourcesContent":["/******/ (function(modules) { // webpackBootstrap\n/******/ \t// The module cache\n/******/ \tvar installedModules = {};\n/******/\n/******/ \t// The require function\n/******/ \tfunction __webpack_require__(moduleId) {\n/******/\n/******/ \t\t// Check if module is in cache\n/******/ \t\tif(installedModules[moduleId]) {\n/******/ \t\t\treturn installedModules[moduleId].exports;\n/******/ \t\t}\n/******/ \t\t// Create a new module (and put it into the cache)\n/******/ \t\tvar module = installedModules[moduleId] = {\n/******/ \t\t\ti: moduleId,\n/******/ \t\t\tl: false,\n/******/ \t\t\texports: {}\n/******/ \t\t};\n/******/\n/******/ \t\t// Execute the module function\n/******/ \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n/******/\n/******/ \t\t// Flag the module as loaded\n/******/ \t\tmodule.l = true;\n/******/\n/******/ \t\t// Return the exports of the module\n/******/ \t\treturn module.exports;\n/******/ \t}\n/******/\n/******/\n/******/ \t// expose the modules object (__webpack_modules__)\n/******/ \t__webpack_require__.m = modules;\n/******/\n/******/ \t// expose the module cache\n/******/ \t__webpack_require__.c = installedModules;\n/******/\n/******/ \t// define getter function for harmony exports\n/******/ \t__webpack_require__.d = function(exports, name, getter) {\n/******/ \t\tif(!__webpack_require__.o(exports, name)) {\n/******/ \t\t\tObject.defineProperty(exports, name, {\n/******/ \t\t\t\tconfigurable: false,\n/******/ \t\t\t\tenumerable: true,\n/******/ \t\t\t\tget: getter\n/******/ \t\t\t});\n/******/ \t\t}\n/******/ \t};\n/******/\n/******/ \t// getDefaultExport function for compatibility with non-harmony modules\n/******/ \t__webpack_require__.n = function(module) {\n/******/ \t\tvar getter = module && module.__esModule ?\n/******/ \t\t\tfunction getDefault() { return module['default']; } :\n/******/ \t\t\tfunction getModuleExports() { return module; };\n/******/ \t\t__webpack_require__.d(getter, 'a', getter);\n/******/ \t\treturn getter;\n/******/ \t};\n/******/\n/******/ \t// Object.prototype.hasOwnProperty.call\n/******/ \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n/******/\n/******/ \t// __webpack_public_path__\n/******/ \t__webpack_require__.p = \"\";\n/******/\n/******/ \t// Load entry module and return exports\n/******/ \treturn __webpack_require__(__webpack_require__.s = 0);\n/******/ })\n/************************************************************************/\n/******/ ([\n/* 0 */\n/***/ (function(module, exports, __webpack_require__) {\n\n\"use strict\";\n\n\nvar _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"]) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError(\"Invalid attempt to destructure non-iterable instance\"); } }; }();\n\nL.Control.HtmlLegend = L.Control.extend({\n _map: null,\n _activeLayers: 0,\n _alwaysShow: false,\n options: {\n position: 'topright',\n\n // array of legend entries - see README for format\n legends: [],\n\n // if true, legend entries that are from a simple renderer will use compact presentation\n collapseSimple: false,\n\n // if true, will test to see if legend entries look stretched; these are usually in sets of 3 with the middle element having no label\n detectStretched: false,\n\n // if true, legends will be collapsed when a new instance is initialized\n collapsedOnInit: false,\n\n updateOpacity: null,\n defaultOpacity: 1,\n visibleIcon: 'leaflet-html-legend-icon-eye',\n hiddenIcon: 'leaflet-html-legend-icon-eye-slash',\n toggleIcon: 'leaflet-html-legend-icon-eye'\n },\n\n onAdd: function onAdd(map) {\n this._map = map;\n this._container = L.DomUtil.create('div', 'leaflet-control leaflet-bar leaflet-html-legend');\n this._lastId = 0;\n this._entries = {};\n\n // Disable events on container\n L.DomEvent.disableClickPropagation(this._container);\n L.DomEvent.disableScrollPropagation(this._container);\n\n this.render();\n\n return this._container;\n },\n render: function render() {\n var _this = this;\n\n L.DomUtil.empty(this._container);\n\n this.options.legends.forEach(function (legend) {\n return _this._renderLegend(legend);\n }, this);\n\n this._checkVisibility();\n },\n addLegend: function addLegend(legend) {\n if (this._map) {\n this._renderLegend(legend);\n }\n },\n removeLegend: function removeLegend(itemIdx) {\n var entry = this._entries[itemIdx];\n if (entry) {\n if (entry.layer && entry.events) {\n Object.entries(entry.events).forEach(function (_ref) {\n var _ref2 = _slicedToArray(_ref, 2),\n event = _ref2[0],\n handler = _ref2[1];\n\n return entry.layer.off(event, handler);\n });\n }\n L.DomUtil.remove(this._entries[itemIdx].container);\n delete this._entries[itemIdx];\n }\n },\n _renderLegend: function _renderLegend(legend) {\n var _this2 = this;\n\n if (!legend.elements) {\n return;\n }\n\n var elements = legend.elements;\n\n var className = 'legend-block';\n\n if (this.options.detectStretched) {\n if (elements.length === 3 && elements[0].label !== '' && elements[1].label === '' && elements[2].label !== '') {\n className += ' legend-stretched';\n }\n }\n\n var block = L.DomUtil.create('div', className, this._container);\n var entryIdx = ++this._lastId;\n this._entries[entryIdx] = { container: block };\n\n if (this.options.collapseSimple && elements.length === 1 && !elements[0].label) {\n this._addElement(elements[0].html, legend.name, elements[0].style, block);\n this._connectLayer(block, legend, entryIdx);\n return block;\n }\n\n if (legend.name) {\n var header = L.DomUtil.create('h4', null, block);\n L.DomUtil.create('div', 'legend-caret', header);\n L.DomUtil.create('span', null, header).innerHTML = legend.name;\n\n if (this.options.collapsedOnInit) {\n L.DomUtil.addClass(header, 'closed');\n }\n\n L.DomEvent.on(header, 'click', function () {\n if (L.DomUtil.hasClass(header, 'closed')) {\n L.DomUtil.removeClass(header, 'closed');\n } else {\n L.DomUtil.addClass(header, 'closed');\n }\n }, this);\n }\n\n var elementContainer = L.DomUtil.create('div', 'legend-elements', block);\n\n elements.forEach(function (element) {\n _this2._addElement(element.html, element.label, element.style, elementContainer);\n }, this);\n\n this._connectLayer(block, legend, entryIdx);\n return block;\n },\n _addElement: function _addElement(html, label, style, container) {\n var row = L.DomUtil.create('div', 'legend-row', container);\n var symbol = L.DomUtil.create('span', 'symbol', row);\n if (style) {\n Object.entries(style).forEach(function (_ref3) {\n var _ref4 = _slicedToArray(_ref3, 2),\n k = _ref4[0],\n v = _ref4[1];\n\n symbol.style[k] = v;\n });\n }\n symbol.innerHTML = html;\n if (label) {\n L.DomUtil.create('label', null, row).innerHTML = label;\n }\n },\n _updateOpacity: function _updateOpacity(layer, opacity) {\n if (typeof this.options.updateOpacity === 'function') {\n this.options.updateOpacity(layer, opacity);\n } else if (typeof layer.setOpacity === 'function') {\n layer.setOpacity(opacity);\n } else if (typeof layer.setStyle === 'function') {\n layer.setStyle({ opacity: opacity });\n }\n },\n _layerAdd: function _layerAdd(container) {\n this._activeLayers += 1;\n container.style.display = '';\n this._checkVisibility();\n },\n _layerRemove: function _layerRemove(container) {\n this._activeLayers -= 1;\n container.style.display = 'none';\n this._checkVisibility();\n },\n _connectLayer: function _connectLayer(container, legend, entryIdx) {\n var _this3 = this;\n\n var layer = legend.layer;\n\n if (!layer) {\n this._alwaysShow = true;\n return;\n }\n\n var opacity = layer.opacity || this.options.defaultOpacity || 1;\n this._updateOpacity(layer, opacity);\n\n if (this._map.hasLayer(layer)) {\n this._activeLayers += 1;\n } else {\n container.style.display = 'none';\n }\n\n container.classList.add('layer-control');\n\n var toggleButton = L.DomUtil.create('i', 'visibility-toggle ' + this.options.toggleIcon, container);\n toggleButton.dataset.visibileOpacity = opacity;\n L.DomEvent.on(toggleButton, 'click', function (e) {\n var button = e.target;\n if (L.DomUtil.hasClass(button, 'disabled')) {\n L.DomUtil.removeClass(button, 'disabled');\n _this3._updateOpacity(layer, button.dataset.visibileOpacity);\n } else {\n L.DomUtil.addClass(button, 'disabled');\n _this3._updateOpacity(layer, 0);\n }\n });\n\n var opacityController = L.DomUtil.create('span', 'opacity-slider', container);\n\n L.DomUtil.create('span', 'slider-label', opacityController).innerHTML = 'Transparency:';\n\n L.DomUtil.create('i', this.options.visibleIcon, opacityController);\n\n var opacitySlider = L.DomUtil.create('input', null, opacityController);\n opacitySlider.type = 'range';\n opacitySlider.min = 0;\n opacitySlider.max = 1;\n opacitySlider.step = 0.1;\n opacitySlider.onchange = function (e) {\n var newOpacity = 1 - e.target.value || 0;\n _this3._updateOpacity(layer, newOpacity);\n toggleButton.dataset.visibileOpacity = newOpacity;\n L.DomUtil.removeClass(toggleButton, 'disabled');\n };\n opacitySlider.value = 1 - opacity;\n\n L.DomUtil.create('i', this.options.hiddenIcon, opacityController);\n\n var layerAdd = this._layerAdd.bind(this, container);\n var layerRemove = this._layerRemove.bind(this, container);\n layer.on('add', layerAdd).on('remove', layerRemove);\n this._entries[entryIdx].layer = layer;\n this._entries[entryIdx].events = {\n add: layerAdd,\n remove: layerRemove\n };\n },\n _checkVisibility: function _checkVisibility() {\n if (this._alwaysShow || this._activeLayers) {\n this._container.style.display = '';\n } else {\n this._container.style.display = 'none';\n }\n }\n});\n\nL.control.htmllegend = function (options) {\n return new L.Control.HtmlLegend(options);\n};\n\n/***/ })\n/******/ ]);\n\n\n// WEBPACK FOOTER //\n// L.Control.HtmlLegend.js"," \t// The module cache\n \tvar installedModules = {};\n\n \t// The require function\n \tfunction __webpack_require__(moduleId) {\n\n \t\t// Check if module is in cache\n \t\tif(installedModules[moduleId]) {\n \t\t\treturn installedModules[moduleId].exports;\n \t\t}\n \t\t// Create a new module (and put it into the cache)\n \t\tvar module = installedModules[moduleId] = {\n \t\t\ti: moduleId,\n \t\t\tl: false,\n \t\t\texports: {}\n \t\t};\n\n \t\t// Execute the module function\n \t\tmodules[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n \t\t// Flag the module as loaded\n \t\tmodule.l = true;\n\n \t\t// Return the exports of the module\n \t\treturn module.exports;\n \t}\n\n\n \t// expose the modules object (__webpack_modules__)\n \t__webpack_require__.m = modules;\n\n \t// expose the module cache\n \t__webpack_require__.c = installedModules;\n\n \t// define getter function for harmony exports\n \t__webpack_require__.d = function(exports, name, getter) {\n \t\tif(!__webpack_require__.o(exports, name)) {\n \t\t\tObject.defineProperty(exports, name, {\n \t\t\t\tconfigurable: false,\n \t\t\t\tenumerable: true,\n \t\t\t\tget: getter\n \t\t\t});\n \t\t}\n \t};\n\n \t// getDefaultExport function for compatibility with non-harmony modules\n \t__webpack_require__.n = function(module) {\n \t\tvar getter = module && module.__esModule ?\n \t\t\tfunction getDefault() { return module['default']; } :\n \t\t\tfunction getModuleExports() { return module; };\n \t\t__webpack_require__.d(getter, 'a', getter);\n \t\treturn getter;\n \t};\n\n \t// Object.prototype.hasOwnProperty.call\n \t__webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };\n\n \t// __webpack_public_path__\n \t__webpack_require__.p = \"\";\n\n \t// Load entry module and return exports\n \treturn __webpack_require__(__webpack_require__.s = 0);\n\n\n\n// WEBPACK FOOTER //\n// webpack/bootstrap 3c46211c0f65a01ce4a2","L.Control.HtmlLegend = L.Control.extend({\n _map: null,\n _activeLayers: 0,\n _alwaysShow: false,\n options: {\n position: 'topright',\n\n // array of legend entries - see README for format\n legends: [],\n\n // if true, legend entries that are from a simple renderer will use compact presentation\n collapseSimple: false,\n\n // if true, will test to see if legend entries look stretched; these are usually in sets of 3 with the middle element having no label\n detectStretched: false,\n\n // if true, legends will be collapsed when a new instance is initialized\n collapsedOnInit: false,\n\n updateOpacity: null,\n defaultOpacity: 1,\n visibleIcon: 'leaflet-html-legend-icon-eye',\n hiddenIcon: 'leaflet-html-legend-icon-eye-slash',\n toggleIcon: 'leaflet-html-legend-icon-eye'\n },\n\n onAdd(map) {\n this._map = map;\n this._container = L.DomUtil.create('div', 'leaflet-control leaflet-bar leaflet-html-legend');\n this._lastId = 0;\n this._entries = {};\n\n // Disable events on container\n L.DomEvent.disableClickPropagation(this._container);\n L.DomEvent.disableScrollPropagation(this._container);\n\n this.render();\n\n return this._container;\n },\n\n render() {\n L.DomUtil.empty(this._container);\n\n this.options.legends.forEach(legend => this._renderLegend(legend), this);\n\n this._checkVisibility();\n },\n\n addLegend(legend) {\n if (this._map) {\n this._renderLegend(legend);\n }\n },\n\n removeLegend(itemIdx) {\n const entry = this._entries[itemIdx]\n if (entry) {\n if (entry.layer && entry.events) {\n Object.entries(entry.events).forEach(([event, handler]) => entry.layer.off(event, handler))\n }\n L.DomUtil.remove(this._entries[itemIdx].container)\n delete this._entries[itemIdx]\n }\n },\n\n _renderLegend(legend) {\n if (!legend.elements) {\n return;\n }\n\n const elements = legend.elements;\n\n let className = 'legend-block';\n\n if (this.options.detectStretched) {\n if (\n elements.length === 3 &&\n elements[0].label !== '' &&\n elements[1].label === '' &&\n elements[2].label !== ''\n ) {\n className += ' legend-stretched';\n }\n }\n\n const block = L.DomUtil.create('div', className, this._container);\n const entryIdx = ++this._lastId;\n this._entries[entryIdx] = { container: block }\n\n if (this.options.collapseSimple && elements.length === 1 && !elements[0].label) {\n this._addElement(elements[0].html, legend.name, elements[0].style, block);\n this._connectLayer(block, legend, entryIdx);\n return block;\n }\n\n if (legend.name) {\n const header = L.DomUtil.create('h4', null, block);\n L.DomUtil.create('div', 'legend-caret', header);\n L.DomUtil.create('span', null, header).innerHTML = legend.name;\n\n if (this.options.collapsedOnInit) {\n L.DomUtil.addClass(header, 'closed');\n }\n\n L.DomEvent.on(header, 'click', () => {\n if (L.DomUtil.hasClass(header, 'closed')) {\n L.DomUtil.removeClass(header, 'closed');\n }\n else {\n L.DomUtil.addClass(header, 'closed');\n }\n }, this);\n }\n\n const elementContainer = L.DomUtil.create('div', 'legend-elements', block);\n\n elements.forEach((element) => {\n this._addElement(element.html, element.label, element.style, elementContainer);\n }, this);\n\n this._connectLayer(block, legend, entryIdx);\n return block;\n },\n\n _addElement(html, label, style, container) {\n const row = L.DomUtil.create('div', 'legend-row', container);\n const symbol = L.DomUtil.create('span', 'symbol', row);\n if (style) {\n Object.entries(style).forEach(([k, v]) => { symbol.style[k] = v; });\n }\n symbol.innerHTML = html;\n if (label) {\n L.DomUtil.create('label', null, row).innerHTML = label;\n }\n },\n\n _updateOpacity(layer, opacity) {\n if (typeof this.options.updateOpacity === 'function') {\n this.options.updateOpacity(layer, opacity)\n } else if (typeof layer.setOpacity === 'function') {\n layer.setOpacity(opacity);\n } else if (typeof layer.setStyle === 'function') {\n layer.setStyle({ opacity });\n }\n },\n\n _layerAdd(container) {\n this._activeLayers += 1;\n container.style.display = '';\n this._checkVisibility();\n },\n\n _layerRemove(container) {\n this._activeLayers -= 1;\n container.style.display = 'none';\n this._checkVisibility();\n },\n\n _connectLayer(container, legend, entryIdx) {\n const layer = legend.layer;\n\n if (!layer) {\n this._alwaysShow = true;\n return;\n }\n\n const opacity = layer.opacity || this.options.defaultOpacity || 1;\n this._updateOpacity(layer, opacity);\n\n if (this._map.hasLayer(layer)) {\n this._activeLayers += 1;\n }\n else {\n container.style.display = 'none';\n }\n\n container.classList.add('layer-control');\n\n const toggleButton = L.DomUtil.create('i', `visibility-toggle ${this.options.toggleIcon}`, container);\n toggleButton.dataset.visibileOpacity = opacity;\n L.DomEvent.on(toggleButton, 'click', (e) => {\n const button = e.target;\n if (L.DomUtil.hasClass(button, 'disabled')) {\n L.DomUtil.removeClass(button, 'disabled');\n this._updateOpacity(layer, button.dataset.visibileOpacity);\n }\n else {\n L.DomUtil.addClass(button, 'disabled');\n this._updateOpacity(layer, 0);\n }\n });\n\n const opacityController = L.DomUtil.create('span', 'opacity-slider', container);\n\n L.DomUtil.create('span', 'slider-label', opacityController).innerHTML = 'Transparency:';\n\n L.DomUtil.create('i', this.options.visibleIcon, opacityController);\n\n const opacitySlider = L.DomUtil.create('input', null, opacityController);\n opacitySlider.type = 'range';\n opacitySlider.min = 0;\n opacitySlider.max = 1;\n opacitySlider.step = 0.1;\n opacitySlider.onchange = ((e) => {\n const newOpacity = 1 - e.target.value || 0;\n this._updateOpacity(layer, newOpacity);\n toggleButton.dataset.visibileOpacity = newOpacity;\n L.DomUtil.removeClass(toggleButton, 'disabled');\n });\n opacitySlider.value = 1 - (opacity);\n\n L.DomUtil.create('i', this.options.hiddenIcon, opacityController);\n\n\n const layerAdd = this._layerAdd.bind(this, container)\n const layerRemove = this._layerRemove.bind(this, container)\n layer.on('add', layerAdd).on('remove', layerRemove)\n this._entries[entryIdx].layer = layer\n this._entries[entryIdx].events = {\n add: layerAdd,\n remove: layerRemove\n }\n },\n\n _checkVisibility() {\n if (this._alwaysShow || this._activeLayers) {\n this._container.style.display = '';\n }\n else {\n this._container.style.display = 'none';\n }\n }\n});\n\nL.control.htmllegend = options => new L.Control.HtmlLegend(options);\n\n\n\n// WEBPACK FOOTER //\n// ./src/L.Control.HtmlLegend.js"],"sourceRoot":""} \ No newline at end of file diff --git a/index.html b/index.html index 8971a3b..cd3dec7 100644 --- a/index.html +++ b/index.html @@ -282,15 +282,11 @@ }).addTo(map) var layer2 = L.geoJSON(layer2GeoJSON, { - style: function (feature) { - return { color: 'blue', fill: false } - } + style: { color: 'blue', fill: false } }) var layer3 = L.geoJSON(layer3GeoJSON, { - style: function (feature) { - return { color: 'orange', fill: false } - } + style: { color: 'orange', fill: false } }).addTo(map) var layer4 = L.geoJSON(layer4GeoJSON, { @@ -301,7 +297,7 @@ 'Layer 1': layer1, 'Layer 2': layer2, 'Layer 3': layer3, - 'Layer 4:': layer4 + 'Layer 4': layer4 } L.control.layers(null, overlays, { collapsed: false }).addTo(map) @@ -390,6 +386,23 @@ }) map.addControl(htmlLegend4) + + var DeleteControl = L.Control.extend({ + options: { + position: 'topright' + }, + onAdd: function(m) { + var btn = L.DomUtil.create('button') + btn.innerText = 'Delete layer 1' + L.DomEvent.on(btn, 'click', function() { + // Remove legend uses entry id, which can be accessed through `htmllegend._entries` + htmlLegend1and2.removeLegend(1) + m.removeControl(this) + }) + return btn + } + }) + map.addControl(new DeleteControl()) diff --git a/package.json b/package.json index 8cc4be5..b255c00 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "leaflet-html-legend", - "version": "0.3.1", + "version": "0.3.2", "description": "Leaflet legend plugin using html elements", "homepage": "http://github.com/consbio/Leaflet.HtmlLegend", "author": { @@ -32,6 +32,7 @@ }, "keywords": [ "leaflet", - "leaflet-legend" + "leaflet-legend", + "leaflet-html-legend" ] } diff --git a/src/L.Control.HtmlLegend.js b/src/L.Control.HtmlLegend.js index 29b09e6..3106e44 100755 --- a/src/L.Control.HtmlLegend.js +++ b/src/L.Control.HtmlLegend.js @@ -27,6 +27,8 @@ L.Control.HtmlLegend = L.Control.extend({ onAdd(map) { this._map = map; this._container = L.DomUtil.create('div', 'leaflet-control leaflet-bar leaflet-html-legend'); + this._lastId = 0; + this._entries = {}; // Disable events on container L.DomEvent.disableClickPropagation(this._container); @@ -40,18 +42,28 @@ L.Control.HtmlLegend = L.Control.extend({ render() { L.DomUtil.empty(this._container); - this.options.legends.forEach(this._renderLegend, this); + this.options.legends.forEach(legend => this._renderLegend(legend), this); this._checkVisibility(); }, addLegend(legend) { - this.options.legends.push(legend); if (this._map) { this._renderLegend(legend); } }, + removeLegend(itemIdx) { + const entry = this._entries[itemIdx] + if (entry) { + if (entry.layer && entry.events) { + Object.entries(entry.events).forEach(([event, handler]) => entry.layer.off(event, handler)) + } + L.DomUtil.remove(this._entries[itemIdx].container) + delete this._entries[itemIdx] + } + }, + _renderLegend(legend) { if (!legend.elements) { return; @@ -73,11 +85,13 @@ L.Control.HtmlLegend = L.Control.extend({ } const block = L.DomUtil.create('div', className, this._container); + const entryIdx = ++this._lastId; + this._entries[entryIdx] = { container: block } if (this.options.collapseSimple && elements.length === 1 && !elements[0].label) { this._addElement(elements[0].html, legend.name, elements[0].style, block); - this._connectLayer(block, legend); - return; + this._connectLayer(block, legend, entryIdx); + return block; } if (legend.name) { @@ -105,7 +119,8 @@ L.Control.HtmlLegend = L.Control.extend({ this._addElement(element.html, element.label, element.style, elementContainer); }, this); - this._connectLayer(block, legend); + this._connectLayer(block, legend, entryIdx); + return block; }, _addElement(html, label, style, container) { @@ -130,7 +145,19 @@ L.Control.HtmlLegend = L.Control.extend({ } }, - _connectLayer(container, legend) { + _layerAdd(container) { + this._activeLayers += 1; + container.style.display = ''; + this._checkVisibility(); + }, + + _layerRemove(container) { + this._activeLayers -= 1; + container.style.display = 'none'; + this._checkVisibility(); + }, + + _connectLayer(container, legend, entryIdx) { const layer = legend.layer; if (!layer) { @@ -185,19 +212,15 @@ L.Control.HtmlLegend = L.Control.extend({ L.DomUtil.create('i', this.options.hiddenIcon, opacityController); - this._map.on('layeradd', (e) => { - if (e.layer === layer) { - this._activeLayers += 1; - container.style.display = ''; - this._checkVisibility(); - } - }).on('layerremove', (e) => { - if (e.layer === layer) { - this._activeLayers -= 1; - container.style.display = 'none'; - this._checkVisibility(); - } - }); + + const layerAdd = this._layerAdd.bind(this, container) + const layerRemove = this._layerRemove.bind(this, container) + layer.on('add', layerAdd).on('remove', layerRemove) + this._entries[entryIdx].layer = layer + this._entries[entryIdx].events = { + add: layerAdd, + remove: layerRemove + } }, _checkVisibility() {