# Point (класс точки фигуры)
```bash
let point = new WMap.Point({
  map: map,
  center: new WMap.LngLat(116.479662, 39.996956),
  extData: {'name': 'точка'}
})

// Левое нажатие кнопки мыши
point.on('click', e => {  
  console.log(e.target.getExtData())
})
// Правое нажатие кнопки мыши
point.on('contextmenu', e => {
  console.log(e.target.getExtData())
})
// Двойное нажатие левой кнопки мыши
point.on('dblclick', e => {
  console.log(e.target.getExtData())
})

// Параметры:
map: напрямую передаётся экземпляр карты, если этот параметр не заполнить, то можно добавить с помощью map.add;
center: координаты широты и долготы;
extData: пользовательские данные.

// Методы:
point.show() — показать точку на карте;
point.hide() — скрыть точку на карте;
point.getExtData() — получить пользовательские данные.

let line= new WMap.Line({
  map: map,
  path: [new WMap.LngLat(116.477648, 39.997149), new WMap.LngLat(116.480078, 39.996506)],
  extData:{'name': 'линия'} 
})

// Левое нажатие кнопки мыши
line.on('click', e => {  
  console.log(e.target.getExtData())
})
// Правое нажатие кнопки мыши
line.on('contextmenu', e => {
  console.log(e.target.getExtData())
})
// Двойное нажатие левой кнопки мыши
line.on('dblclick', e => {
  console.log(e.target.getExtData())
})

// Параметры:
map: напрямую передаётся экземпляр карты, если этот параметр не заполнить, то можно добавить с помощью map.add;
path: массив координат широты и долготы;
extData: пользовательские данные.

// Методы:
line.show() — показать линию на карте;
line.hide() — скрыть линию на карте;
line.getExtData() — получить пользовательские данные;
line.setPath() — изменить отрезок линии.

const circle = new WMap.Circle({
  map: map,
  center: new WMap.LngLat(116.47614550262452, 39.99763225396728),
  radius: 81.7,
  extData:{'name': 'круг'},
  option: { // Пользовательские параметры стиля
    fillColor: '#264df6', // Цвет заливки
    strokeColor: '#264df6', // Цвет контура
    strokeWidth: 2, // Ширина контура
    lineCap: 'round', // Стиль линии: butt, round или square
    lineJoin: 'round', //  Стиль соединения линий: bevel, round или miter
    imageRadius: 7, // Размер точки в стиле
    imageFill: '#264df6' // Заполнение точки в стиле
  }
})

// Левое нажатие кнопки мыши
circle.on('click', e => {  
  console.log(e.target.getExtData())
})
// Правое нажатие кнопки мыши
circle.on('contextmenu', e => {
  console.log(e.target.getExtData())
})
// Двойное нажатие левой кнопки мыши
circle.on('dblclick', e => {
  console.log(e.target.getExtData())
})

// Параметры:
map: напрямую передаётся экземпляр карты, если этот параметр не заполнить, то можно добавить с помощью map.add;
center: координаты широты и долготы центра;
radius: длина радиуса;
extData: пользовательские данные.

// Методы:
circle.show() — показать круг на карте;
circle.hide() — скрыть круг на карте;
circle.getExtData() — получить пользовательские данные.

const polygon = new WMap.Polygon({
  map: map,
  path: [new WMap.LngLat(116.47699844509125, 39.9982652552948), new WMap.LngLat(116.47721838623048, 39.997278202377316), new WMap.LngLat(116.47869360118867, 39.99738549073791), new WMap.LngLat(116.47857558399201, 39.9979058392868), new WMap.LngLat(116.47837710052491, 39.99842618783569)],
  extData: {'name': 'многоугольник'},
  option: { // Пользовательские параметры стиля
    fillColor: '#264df6', // Цвет заливки
    strokeColor: '#264df6', // Цвет контура
    strokeWidth: 2, // Ширина контура
    lineCap: 'round', // Стиль линии: butt, round или square
    lineJoin: 'round', //  Стиль соединения линий: bevel, round или miter
    imageRadius: 7, // Размер точки в стиле
    imageFill: '#264df6' // Заполнение точки в стиле
  }
})

// Левое нажатие кнопки мыши
polygon.on('click', e => {  
  console.log(e.target.getExtData())
})
// Правое нажатие кнопки мыши
polygon.on('contextmenu', e => {
  console.log(e.target.getExtData())
})
// Двойное нажатие левой кнопки мыши
polygon.on('dblclick', e => {
  console.log(e.target.getExtData())
})

// Параметры:
map: напрямую передаётся экземпляр карты, если этот параметр не заполнить, то можно добавить с помощью map.add;
path: массив координат широты и долготы вершин многоугольника;
extData: пользовательские данные.

// Методы:
polygon.show() — показать многоугольник на карте;
polygon.hide() — скрыть многоугольник на карте;
polygon.getExtData() — получить пользовательские данные.

const rectangle = new WMap.Rectangle({
  map: map,
  path: [new WMap.LngLat(116.48053896099091,39.99640916665649), new WMap.LngLat(116.48225557476044, 39.99715482076263)],
  extData: {'name': 'прямоугольник'},
  option: { // Пользовательские параметры стиля
    fillColor: '#264df6', // Цвет заливки
    strokeColor: '#264df6', // Цвет контура
    strokeWidth: 2, // Ширина контура
    lineCap: 'round', // Стиль линии: butt, round или square
    lineJoin: 'round', //  Стиль соединения линий: bevel, round или miter
    imageRadius: 7, // Размер точки в стиле
    imageFill: '#264df6' // Заполнение точки в стиле
  }
})

// Левое нажатие кнопки мыши
rectangle.on('click', e => {  
  console.log(e.target.getExtData())
})
// Правое нажатие кнопки мыши
rectangle.on('contextmenu', e => {
  console.log(e.target.getExtData())
})
// Двойное нажатие левой кнопки мыши
rectangle.on('dblclick', e => {
  console.log(e.target.getExtData())
})

// Параметры:
map: напрямую передаётся экземпляр карты, если этот параметр не заполнить, то можно добавить с помощью map.add;
path: массив координат широты и долготы сторон прямоугольника;
extData: пользовательские данные. **Методы: подробности**

rectangle.show() — на карте отображается многоугольник.
rectangle.hide() — на карте скрывается многоугольник. 
rectangle.getExtData() — получение пользовательских данных.

**11. InfoWindow (класс информационного окна)**

Существует несколько способов создания экземпляра класса информационного окна:
* Способ 1: обычный режим.
let Single1 = new WMap.InfoWindow({
    title: 'Метка',
    content: 'Это метка.',
    offset: [0, 0],
    width: 200,
    height: 100
});

* Способ 2: пользовательский режим с передачей DOM.
let Single2 = new WMap.InfoWindow({
    content: document.querySelector('#single'),
    offset: [0, 0],
    width: 200,
    height: 100
});

* Способ 3: пользовательский режим с передачей HTML-строки.
let Single = new WMap.InfoWindow({
    content: `<div>123</div>`,
    offset: [0, 0],
    width: 200,
    height: 100
});

Параметры:
content: (string | HTMLDivElement | HtmlString) — содержимое.
title: string = 'Информационное окно' — заголовок в обычном режиме.
offset: Array[number] = [0, 0] — второй сдвиг.
position: string = 'top-left' — первый сдвиг.
width = 200 — ширина информационного окна по умолчанию (box-sizing: border-box).
height = 100 — высота информационного окна по умолчанию (box-sizing: border-box).

Поддерживаются события: ['click', 'dblclick', 'contextmenu'].

**12. Polyline (класс траектории)**

В основном класс траектории используется для отслеживания траектории движения транспортного средства и включает три типа экземпляров:
* исторические экземпляры двойной траектории;
* исторические экземпляры одиночной траектории;
* экземпляры текущей траектории.

Каждый тип экземпляра состоит из класса Polyline и класса Marker.

Класс Polyline:
mode: 'all' — режим траектории.
path: [] — массив координат точек.
zIndex: 2 — порядок наложения объектов.
showDir: true — показывать ли белый указатель направления.
strokeOpacity: 0.9 — прозрачность линии.
strokeWeight: 10 — толщина линии.
strokeStyle: 'solid' — стиль контура линии (сплошная линия: solid, пунктирная линия: dashed).
strokeDasharray: [] — интервал контура линии.
lineCap: 'butt' — способ обработки концов ломаной линии, по умолчанию — без головы (butt), другие варианты: round (с круглой головкой), square (с квадратной головкой).
lineJoin: 'round' — метод обработки углов ломаной линии, по умолчанию — скруглённые углы (round), другие варианты: round (скруглённые углы), bevel (скошенные углы).
isOutline: false — есть ли контур у линии, по умолчанию — нет.
borderWeight: 10 — ширина контура, по умолчанию равна 1.
outlineColor: '#000000' — цвет контура линии, этот параметр действует только при isOutline = true, по умолчанию: #000000.
extData: null — пользовательские данные.
segmentLength: 50 — обработка пути на сегменты, чтобы предотвратить слишком большие промежутки между путями, по умолчанию равно 50 м.
strokeColor?: '#28F' — цвет линии.
activeStrokeColor?: 'green' — цвет активной линии, по умолчанию зелёный.
segmentLength: 2 — минимальная длина подпути.
units: 'meters' — единицы измерения минимальной длины подпути.

Общие методы класса Polyline:
polyline.setPath() — установить текущий путь координат.
polyline.clearHistoryPath() — очистить исторический путь траектории.
polyline.clearRealPath() — очистить текущий путь траектории.
polyline.getHistoryPath() — получить исторический путь траектории.
polyline.getRealPath() — получить текущий путь траектории.
polyline.setVisible(type: boolean) — скрыть или показать историческую траекторию (только для режима исторической траектории).

Класс Marker:
marker.move(polyline, curPath) — начало движения по текущей траектории при движении транспортного средства.
marker.getIndex() — исходный индекс пути движения в исторической траектории.
marker.getMoveIndex() — виртуальный индекс пути движения в исторической траектории.
marker.getRatio() — текущая скорость движения транспортного средства в исторической траектории.
marker.updateMoveDistance(radio: Number) — обновление текущего расстояния движения транспортного средства (используется для перетаскивания индикатора выполнения), параметр — число с плавающей запятой от 0 до 1.
marker.updateMoveSpeed(radio: Number) — обновить текущую скорость движения транспортного средства, параметр — число с плавающей запятой.
marker.moveAlong(path = [], angleFixed = false, speed = 60, lockScope = true) — начать движение транспортного средства вдоль пути, рекомендуется использовать четвёртый параметр для достижения лучшего эффекта.
marker.stopMove() — остановить движение транспортного средства.
marker.resumeMove() — возобновить движение транспортного средства после остановки.
marker.pauseMove() — приостановить движение транспортного средства.

Как определить нужный экземпляр?
При создании экземпляра класса Polyline можно определить:
* наличие параметров strokeColor и activeStrokeColor означает двойную историческую траекторию;
* наличие параметра strokeColor означает одиночную историческую траекторию;
* наличие параметра activeStrokeColor означает текущую траекторию.

**13. ContextMenu (класс контекстного меню)**

Пример экземпляра класса контекстного меню:
const contextMenu = new WMap.ContextMenu();

По умолчанию:
this.defaultMenuList = [ // меню по умолчанию
  {
    title: 'Увеличить уровень',
    callBack: () => {
      this.map.setZoomIn()
    }
  },
  {
    title: 'Уменьшить уровень',
    callBack: () => {
      this.map.setZoomOut()
    }
  }
];

Методы:
* добавить подменю: contextMenu.addMenu({title: string, callBack: Function});
* удалить подменю: contextMenu.removeMenu(title: string);
* отобразить контекстное меню: contextMenu.open(map: Map, coordinate: Array[lng: number, lat: number]).

**14. Tool (класс инструмента)**

Пример создания инструмента:
let tools = new WMap.Tool(map, {style: 样式, unit: 进制单位(km | m)});

Параметры класса Tool:
map — экземпляр карты.
style — стиль, если не установлен, будет использоваться общий стиль.
unit — единица измерения (км или м), при измерении длины или площади результат будет отображаться в км или м, по умолчанию км.

Методы класса Tool:
tools.setStyle() — установка стиля отображения.
tools.getStyle() — получение стиля отображения.
tools.close() — прекращение использования инструмента.
tools.distance() — начало измерения расстояния.
tools.area() — начало измерения площади. ```
tools.remove(featrue) // 删除对应的矢量图形, feature 为下面 done 事件返回的 feature

// 监听工具类完成返回结果
tools.on('done', e => {
  console.log(e)
  feature = e.feature
})