Leaflet-CanvasLayer，如何将它添加到图层列表？

Question

我想将 tiff 图像添加到传单地图。 我已经成功添加了这个(https://codepen.io/VictorVelarde/pen/ZKJWMb/)

var tiff = "https://ihcantabria.github.io/Leaflet.CanvasLayer.Field/data/tz850.tiff";
fetch(tiff).then(r => r.arrayBuffer()).then(function(buffer) {
  var s = L.ScalarField.fromGeoTIFF(buffer);
  let layer = L.canvasLayer.scalarField(s).addTo(map);
  layer.on("click", function(e) {
    if (e.value !== null) {
      let popup = L.popup()
      .setLatLng(e.latlng)
      .setContent(`${e.value}`)
      .openOn(map);
    }
  });

  map.fitBounds(layer.getBounds());
});

到我的地图，但现在我想将它添加到图层列表。对于图层，我使用添加了 baseTree 的标准图层控件 - 带有几个 TileLayers 和带有一些点图层的 overlaysTree。

如何在 TileLayers 上叠加 tiff 图像并选择打开和关闭它？