javascript - 是否可以将自定义 HTML 添加到传单层组和层控制

Question

有没有办法将自定义 HTML 注入(inject)图层组和图层控件？

在我们的应用程序中，我们实现了 slider (input:range) 来调整不透明度设置，并且很明显，在其控件容器内为基础层设置专用 slider 是有意义的。没有修改此控件的选项或参数:

理想情况下，我们希望在此组和图层控件中创建一个自定义 slider (显然，我们的“基础图层”控件组仅限于一组图层选项):

感谢您的帮助!

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关于创建插件。