---
title: IControl
source: https://vjmap.com/en/doc/IControl.html
---

# IControl
添加到地图的交互式控件界面。这是实现者建模的规范：它不是导出的方法或类。

控件必须实现`onAdd`和`onRemove`，并且必须拥有一个元素，通常是一个`div`元素。要使用默认控件样式，请将`vjmap-ctrl`类添加到控件的节点。

### Examples
```
// Control implemented as ES6 class
class HelloWorldControl {
    onAdd(map) {
        this._map = map;
        this._container = document.createElement('div');
        this._container.className = 'vjmap-ctrl';
        this._container.textContent = 'Hello, world';
        return this._container;
    }

    onRemove() {
        this._container.parentNode.removeChild(this._container);
        this._map = undefined;
    }
}

// Control implemented as ES5 prototypical class
function HelloWorldControl() { }

HelloWorldControl.prototype.onAdd = function(map) {
    this._map = map;
    this._container = document.createElement('div');
    this._container.className = 'vjmap-ctrl';
    this._container.textContent = 'Hello, world';
    return this._container;
};

HelloWorldControl.prototype.onRemove = function () {
     this._container.parentNode.removeChild(this._container);
     this._map = undefined;
};
```

### onAdd
在地图上注册一个控件并让它有机会注册事件侦听器和资源。该方法由`Map#addControl` 内部调用。

#### Parameters
- `map` **`映射`**此控件将添加到的映射

返回**`HTMLElement`**控件的容器元素。这应该由控件创建并由 onAdd 返回而不附加到 DOM：地图将根据需要将控件的元素插入到 DOM 中。

### onRemove
取消注册地图上的控件并让它有机会分离事件侦听器和资源。该方法由`Map#removeControl` 内部调用。

#### Parameters
- `map` **`映射`**此控件将从中删除的映射

返回**`undefined`**此方法不需要返回值

### getDefaultPosition
（可选）为此控件提供默认位置。如果实现了该方法并且`在`没有`position` 参数的情况下调用`Map#addControl`，则 getDefaultPosition 返回的值将用作控件的位置。

返回**`string`**一个控件位置，它是 addControl 中有效值之一。