是否可以將自定義HTML添加到傳單層組和層控件

Question

有沒有任何方法將自定義HTML注入到圖層組和圖層控件？

在我們的應用程序中，我們實現了滑塊（輸入：範圍）來調整不透明度設置，並且越來越明顯，控制容器內部的基礎層的專用滑塊很有意義。沒有選項或參數修改此控制：

existing layer group control

理想情況下，我們要建立這個組和層控（顯然我們的「基層」對照組被限制在一組內的自定義滑塊圖層選項）：

example of what we'd like to achieve

感謝您的幫助！

Answer 1

不與默認代碼。

你可以，但是，延伸層控制和創建一個子類，增加了一些額外的功能，例如：

L.Control.Layers.WithSomethingExtra = L.Control.Layers.extend({ 
    _initLayout: function() { 
    L.Control.Layers.prototype._initLayout.call(this); 
    L.DomUtil.create('div', 'leaflet-control-layers-separator', this._form); 
    var myThing = L.DomUtil.create('div', 'some-extra-thing', this._form); 
    myThing.innerHTML = 'My custom thing inside the layers control!!'; 
    } 
}); 

見這樣的一個working demo here。

如果這造成混淆，請閱讀source code for src/control/Control.Layers.js和Leaflet tutorials關於創建插件。

Answer 2

雖然它可能不是很優雅簡單爲你空div創造一個獨特的類名，並使用了document.createElement附加HTML對象（「輸入」）將工作，按照本例：

https://playground-leaflet.rhcloud.com/mogo/1/edit?html,console,output