diff --git a/README.md b/README.md
index e2093bb..cb8f18f 100644
--- a/README.md
+++ b/README.md
@@ -36,7 +36,7 @@ collapsed: false or true
//The position of the control (one of the map corners).
position: 'topleft' or 'topright' or 'bottomleft' or 'bottomright'
-//Optional label to present before the controls (e.g. "Layers Opacity")
+//Label display of title (e.g. "Layers Opacity")
label: string or null
```
@@ -153,7 +153,10 @@ L.control.layers(
//OpacityControl
L.control.opacity(
- Map_AddLayer
+ Map_AddLayer,
+ {
+ label: "Layers Opacity"
+ }
).addTo(map);
```
@@ -246,7 +249,10 @@ L.control.layers(
//OpacityControl
L.control.opacity(
- Map_AddLayer
+ Map_AddLayer,
+ {
+ label: "Layers Opacity"
+ }
).addTo(map);
```
@@ -306,6 +312,9 @@ collapsed: false or true
//コントロールの配置設定。(デフォルト:右上配置)
position: 'topleft' or 'topright' or 'bottomleft' or 'bottomright'
+//タイトルのラベル表示(例:Layers Opacity)
+label: string or null
+
```
@@ -420,7 +429,10 @@ L.control.layers(
//OpacityControl
L.control.opacity(
- Map_AddLayer
+ Map_AddLayer,
+ {
+ label: "Layers Opacity"
+ }
).addTo(map);
```
@@ -513,7 +525,10 @@ L.control.layers(
//OpacityControl
L.control.opacity(
- Map_AddLayer
+ Map_AddLayer,
+ {
+ label: "Layers Opacity"
+ }
).addTo(map);
```
diff --git a/dist/L.Control.Opacity.css b/dist/L.Control.Opacity.css
index 52ea3b4..eb61cc3 100755
--- a/dist/L.Control.Opacity.css
+++ b/dist/L.Control.Opacity.css
@@ -1 +1 @@
-input[type=range]{-webkit-appearance:none;-webkit-tap-highlight-color:rgba(255,255,255,0);width:110px;height:10px;margin:0;border:none;padding:1px 2px;border-radius:30px;background:#F1F0EE;outline:0}input[type=range]::-ms-track{border:inherit;color:transparent;background:0 0}input[type=range]::-ms-fill-lower,input[type=range]::-ms-fill-upper{background:0 0}input[type=range]::-ms-tooltip{display:none}input[type=range]::-ms-thumb{width:15px;height:18px;border-radius:12px;border:0;background-image:linear-gradient(to bottom,#1253A4 0,#1253A4 100%)}
\ No newline at end of file
+input[type=range]{-webkit-appearance:none;-webkit-tap-highlight-color:rgba(255,255,255,0);width:110px;height:10px;margin:0;border:none;padding:1px 2px;border-radius:30px;background:#F1F0EE;outline:0}input[type=range]::-ms-track{border:inherit;color:transparent;background:0 0}input[type=range]::-ms-fill-lower,input[type=range]::-ms-fill-upper{background:0 0}input[type=range]::-ms-tooltip{display:none}input[type=range]::-ms-thumb{width:15px;height:18px;border-radius:12px;border:0;background-image:linear-gradient(to bottom,#1253A4 0,#1253A4 100%)}.leaflet-control-layers-label{margin:0 0 8px 1px}
\ No newline at end of file
diff --git a/dist/L.Control.Opacity.js b/dist/L.Control.Opacity.js
old mode 100644
new mode 100755
index 8d0da9c..0010303
--- a/dist/L.Control.Opacity.js
+++ b/dist/L.Control.Opacity.js
@@ -1 +1 @@
-L.Control.Opacity=L.Control.extend({options:{collapsed:!1,position:"topright"},initialize:function(t,e){for(i in L.Util.setOptions(this,e),this._layerControlInputs=[],this._layers=[],this._lastZIndex=0,this._handlingClick=!1,t)this._addLayer(t[i],i,!0)},onAdd:function(t){return this._initLayout(),this._update(),this._container},expand:function(){L.DomUtil.addClass(this._container,"leaflet-control-layers-expanded"),this._form.style.height=null;var t=this._map.getSize().y-(this._container.offsetTop+50);return t1,this._baseLayersList.style.display=t?"":"none"),this._separator.style.display=e&&t?"":"none",this},_addItem:function(t){var e,i=document.createElement("label");t.overlay?(e=document.createElement("input"),e.type="range",e.className="leaflet-control-layers-range",e.min=0,e.max=100,e.value=100):e=this._createRadioElement("leaflet-base-layers",checked),this._layerControlInputs.push(e),e.layerId=L.Util.stamp(t.layer),L.DomEvent.on(e,"click",this._onInputClick,this);var a=document.createElement("span");a.innerHTML=" "+t.name;var s=document.createElement("div"),l=document.createElement("div");i.appendChild(s),s.appendChild(a),i.appendChild(l),l.appendChild(e);var n=t.overlay?this._overlaysList:this._baseLayersList;return n.appendChild(i),i},_onInputClick:function(){var t,e,i=this._layerControlInputs;this._handlingClick=!0;for(var a=i.length-1;a>=0;a--)t=i[a],e=this._getLayer(t.layerId).layer,"undefined"==typeof e._url||e.setOpacity(t.value/100);this._handlingClick=!1,this._refocusOnMap()}}),L.control.opacity=function(t,e){return new L.Control.Opacity(t,e)};
\ No newline at end of file
diff --git a/docs/js/script.js b/docs/js/script.js
index deefced..836caf3 100644
--- a/docs/js/script.js
+++ b/docs/js/script.js
@@ -47,8 +47,8 @@ var Map_AddLayer = {
//LayerControl
L.control.layers(
- Map_BaseLayer,
- Map_AddLayer,
+ Map_BaseLayer,
+ Map_AddLayer,
{
collapsed: false
}
@@ -56,5 +56,8 @@ L.control.layers(
//OpacityControl
L.control.opacity(
- Map_AddLayer
+ Map_AddLayer,
+ {
+ label: "Layers Opacity"
+ }
).addTo(map);
diff --git a/docs/plugin/Leaflet.Control.Opacity/dist/L.Control.Opacity.css b/docs/plugin/Leaflet.Control.Opacity/dist/L.Control.Opacity.css
index 52ea3b4..eb61cc3 100755
--- a/docs/plugin/Leaflet.Control.Opacity/dist/L.Control.Opacity.css
+++ b/docs/plugin/Leaflet.Control.Opacity/dist/L.Control.Opacity.css
@@ -1 +1 @@
-input[type=range]{-webkit-appearance:none;-webkit-tap-highlight-color:rgba(255,255,255,0);width:110px;height:10px;margin:0;border:none;padding:1px 2px;border-radius:30px;background:#F1F0EE;outline:0}input[type=range]::-ms-track{border:inherit;color:transparent;background:0 0}input[type=range]::-ms-fill-lower,input[type=range]::-ms-fill-upper{background:0 0}input[type=range]::-ms-tooltip{display:none}input[type=range]::-ms-thumb{width:15px;height:18px;border-radius:12px;border:0;background-image:linear-gradient(to bottom,#1253A4 0,#1253A4 100%)}
\ No newline at end of file
+input[type=range]{-webkit-appearance:none;-webkit-tap-highlight-color:rgba(255,255,255,0);width:110px;height:10px;margin:0;border:none;padding:1px 2px;border-radius:30px;background:#F1F0EE;outline:0}input[type=range]::-ms-track{border:inherit;color:transparent;background:0 0}input[type=range]::-ms-fill-lower,input[type=range]::-ms-fill-upper{background:0 0}input[type=range]::-ms-tooltip{display:none}input[type=range]::-ms-thumb{width:15px;height:18px;border-radius:12px;border:0;background-image:linear-gradient(to bottom,#1253A4 0,#1253A4 100%)}.leaflet-control-layers-label{margin:0 0 8px 1px}
\ No newline at end of file
diff --git a/docs/plugin/Leaflet.Control.Opacity/dist/L.Control.Opacity.js b/docs/plugin/Leaflet.Control.Opacity/dist/L.Control.Opacity.js
old mode 100644
new mode 100755
index 8d0da9c..0010303
--- a/docs/plugin/Leaflet.Control.Opacity/dist/L.Control.Opacity.js
+++ b/docs/plugin/Leaflet.Control.Opacity/dist/L.Control.Opacity.js
@@ -1 +1 @@
-L.Control.Opacity=L.Control.extend({options:{collapsed:!1,position:"topright"},initialize:function(t,e){for(i in L.Util.setOptions(this,e),this._layerControlInputs=[],this._layers=[],this._lastZIndex=0,this._handlingClick=!1,t)this._addLayer(t[i],i,!0)},onAdd:function(t){return this._initLayout(),this._update(),this._container},expand:function(){L.DomUtil.addClass(this._container,"leaflet-control-layers-expanded"),this._form.style.height=null;var t=this._map.getSize().y-(this._container.offsetTop+50);return t1,this._baseLayersList.style.display=t?"":"none"),this._separator.style.display=e&&t?"":"none",this},_addItem:function(t){var e,i=document.createElement("label");t.overlay?(e=document.createElement("input"),e.type="range",e.className="leaflet-control-layers-range",e.min=0,e.max=100,e.value=100):e=this._createRadioElement("leaflet-base-layers",checked),this._layerControlInputs.push(e),e.layerId=L.Util.stamp(t.layer),L.DomEvent.on(e,"click",this._onInputClick,this);var a=document.createElement("span");a.innerHTML=" "+t.name;var s=document.createElement("div"),l=document.createElement("div");i.appendChild(s),s.appendChild(a),i.appendChild(l),l.appendChild(e);var n=t.overlay?this._overlaysList:this._baseLayersList;return n.appendChild(i),i},_onInputClick:function(){var t,e,i=this._layerControlInputs;this._handlingClick=!0;for(var a=i.length-1;a>=0;a--)t=i[a],e=this._getLayer(t.layerId).layer,"undefined"==typeof e._url||e.setOpacity(t.value/100);this._handlingClick=!1,this._refocusOnMap()}}),L.control.opacity=function(t,e){return new L.Control.Opacity(t,e)};
\ No newline at end of file
diff --git a/docs/plugin/Leaflet.Control.Opacity/src/L.Control.Opacity.css b/docs/plugin/Leaflet.Control.Opacity/src/L.Control.Opacity.css
index 1d1b234..8c720db 100755
--- a/docs/plugin/Leaflet.Control.Opacity/src/L.Control.Opacity.css
+++ b/docs/plugin/Leaflet.Control.Opacity/src/L.Control.Opacity.css
@@ -29,4 +29,9 @@ input[type="range"]::-ms-thumb {
border-radius: 12px;
border: 0;
background-image: linear-gradient(to bottom, #1253A4 0, #1253A4 100%);
+}
+
+/* 題名レイアウト */
+.leaflet-control-layers-label {
+ margin: 0px 0px 8px 1px
}
\ No newline at end of file
diff --git a/docs/plugin/Leaflet.Control.Opacity/src/L.Control.Opacity.js b/docs/plugin/Leaflet.Control.Opacity/src/L.Control.Opacity.js
old mode 100644
new mode 100755
index 8f13544..edca56d
--- a/docs/plugin/Leaflet.Control.Opacity/src/L.Control.Opacity.js
+++ b/docs/plugin/Leaflet.Control.Opacity/src/L.Control.Opacity.js
@@ -1,7 +1,8 @@
L.Control.Opacity = L.Control.extend({
options: {
collapsed: false,
- position: 'topright'
+ position: 'topright',
+ label: null
},
initialize: function (overlays, options) {
L.Util.setOptions(this, options);
@@ -41,6 +42,11 @@ L.Control.Opacity = L.Control.extend({
container.setAttribute('aria-haspopup', true);
L.DomEvent.disableClickPropagation(container);
L.DomEvent.disableScrollPropagation(container);
+ if(this.options.label){
+ var labelP = L.DomUtil.create('p', className + "-label");
+ labelP.innerHTML = this.options.label;
+ container.appendChild(labelP);
+ }
var form = this._form = L.DomUtil.create('form', className + '-list');
if (collapsed) {
this._map.on('click', this.collapse, this);
diff --git a/img/img_01.gif b/img/img_01.gif
index b80d05c..e9b0e66 100644
Binary files a/img/img_01.gif and b/img/img_01.gif differ
diff --git a/package.json b/package.json
index 98eac1b..890d96f 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "leaflet.control.opacity",
- "version": "1.2.0",
+ "version": "1.3.0",
"description": "Leaflet.Control.Opacity is a Leaflet plugin that makes multiple tile layers transparent. (Leaflet v1.x.x)",
"main": "dist/L.Control.Opacity.js",
"repository": {
diff --git a/src/L.Control.Opacity.css b/src/L.Control.Opacity.css
index 1d1b234..8c720db 100755
--- a/src/L.Control.Opacity.css
+++ b/src/L.Control.Opacity.css
@@ -29,4 +29,9 @@ input[type="range"]::-ms-thumb {
border-radius: 12px;
border: 0;
background-image: linear-gradient(to bottom, #1253A4 0, #1253A4 100%);
+}
+
+/* 題名レイアウト */
+.leaflet-control-layers-label {
+ margin: 0px 0px 8px 1px
}
\ No newline at end of file
diff --git a/src/L.Control.Opacity.js b/src/L.Control.Opacity.js
old mode 100644
new mode 100755
index df7b98c..edca56d
--- a/src/L.Control.Opacity.js
+++ b/src/L.Control.Opacity.js
@@ -43,9 +43,9 @@ L.Control.Opacity = L.Control.extend({
L.DomEvent.disableClickPropagation(container);
L.DomEvent.disableScrollPropagation(container);
if(this.options.label){
- var labelSpan = L.DomUtil.create('span', className + "-label");
- labelSpan.innerHTML = this.options.label;
- container.appendChild(labelSpan);
+ var labelP = L.DomUtil.create('p', className + "-label");
+ labelP.innerHTML = this.options.label;
+ container.appendChild(labelP);
}
var form = this._form = L.DomUtil.create('form', className + '-list');
if (collapsed) {