Question

使用传单1.0.2，我一直在关注教程Extending Leaflet: Handlers and Controls，我正在构建自己的处理程序，以在地图上绘制一个“边界框”。

到目前为止，这非常有效，请参阅以下示例“伪”代码：

L.BoundingBoxHandler = L.Handler.extend({
  colour: '#0000FF',
  rectangle: null,
  addHooks: function () {
    L.DomEvent.on(this._map._container, 'mousedown', this.start, this);
    L.DomEvent.on(this._map._container, 'mousemove', this.mouseMove, this);
    L.DomEvent.on(this._map._container, 'mouseup', this.mouseUp, this);
  },

  removeHooks: function () {
    L.DomEvent.off(this._map._container, 'mousedown', this.start, this);
    L.DomEvent.off(this._map._container, 'mousemove', this.mouseMove, this);
    L.DomEvent.off(this._map._container, 'mouseup', this.mouseUp, this);
  },

  start: function (ev: MouseEvent) {
    // get the lat long bounds of the mouse then draw a rectangle
    this.rectangle = L.rectangle(latLngBounds, { color: this.colour, 
    weight: 2 }).addTo(this._map);
  },

  mouseMove: function (ev: MouseEvent) {
    // code that gets the current location of mouse 
    // and calls setBounds on the rectangle...
  },

  mouseUp: function (ev: MouseEvent) {
     // remove the bounding box
     this.rectangle.remove();
   }
 });

我通过调用：

将处理程序添加到地图中

map.addHandler('boundy', L.BoundingBoxHandler);

在代码示例中，您可以看到我有一个名为“color”的变量，它决定了矩形的颜色。

我想在创建处理程序时将此颜色作为选项传递，以便我可以更改矩形的颜色。

在Leaflet JS中创建处理程序时，如何传入选项？

Answer 1

在Leaflet JS中创建处理程序时，如何传入选项？

你没有。

查看默认地图处理程序的工作原理：使用地图选项来定义自己的行为。

例如，code for the ScrollWheelZoom handler在地图中定义了以下选项：

隐式 scrollWheelZoom选项，用于在实例化地图时启用/禁用处理程序。
wheelDebounceTime和wheelPxPerZoomLevel选项，用于处理程序的行为。

只要名称不与现有名称冲突，处理程序就可以定义新的地图选项。

因此，如果你有一个BoundingBox处理程序，你可能希望有一个隐式boundingBox选项和boundingBoxStyle选项之类的选项，作为地图选项。

如何将选项传递给Leaflet JS中的Handler？

1 个答案: