Add a title to leaflet layers control

问题:

Does anyone have a method for adding a title to a leaflet layers control? Just a line of text, for example "Available layers." Ideally I'd like to add a link to the text as well.

I thought it would be simple, but I haven't been able to find a solution. I tried methods similar to this question (radio button/checkbox remains after adding "dummy" layer) and this question (adds div to end of layers, seems more complex than my needs). Unfortunately with my experience level, I haven't been able to connect the dots. Any suggestions?

回答1:

Input Elements in Layer Control are present under

.leaflet-control-layers-overlays

$(".leaflet-control-layers-overlays").prepend("<label>Available layers</label>"); You can also assign a class and add some styling on this. This is not good solution but hope it helps you.

回答2:

You can assign a title attribute to the control. Here's an obviously incomplete snippet from a current project:

// Add settings button
var atlasMapSettings = L.Control.extend({
  options: {
    position: 'topleft' 
  },
  onAdd: function (map) {
    var control = L.DomUtil.create('div', 'leaflet-bar leaflet-control leaflet-control-custom atlas-settings-control closed');
    var icon    = L.DomUtil.create('div', 'fa fa-gear closed', control);
    var content = L.DomUtil.create('div', 'control-content empty', control);

    $(icon).attr('title', 'Map settings');