@langge-data/mapbox-gl-measure

a class library of measurement tools based on mapbox-gl

Installation

Requires nodejs.

$ npm install @langge-data/mapbox-gl-measure

API

MapMeasure

一个基于 mapbox gl 的地图测量工具、提供测量距离长度、面积大小等功能

Parameters

• map [Object] 一个实例话的 mapbox gl 的 Map 对象
• options [Object] 用于设置测量工具绘制几何的样式信息及测量单位信息

Examples

var mapMeasure = new MapMeasure(map, {
  unit: "kilometer", //计量单位：kilometer：（千米/km）; meter:（米/m）
  "line-width": 2, //线宽
  "line-opacity": 0.65, //线透明度
  "line-color": "#ff0000", //线颜色
  "fill-color": "#ff0000", //多边形填充颜色
  "fill-opacity": 0.1, //多边形透明度
  "circle-radius": 3, //圆点的半径大小
  "circle-color": "#ffffff", //圆点的颜色
  "circle-stroke-width": 2, //圆点边框的宽度
  "circle-stroke-color": "#ff0000", //圆点边框的颜色
  // 测量结果文字样式
  "tooltip-styles":
    "font-size: 12px;font-weight: bold;text-shadow:-1px 0 white,0 1px white,1px 0 white,0 -1px white;",
});

changeMode

切换测量工具测量模式，可选值['measure_length|measure_area']

var mapMeasure = new MapMeasure(map);
mapMeasure.changeMode("measure_length"); // 测量距离
mapMeasure.changeMode("measure_area"); //测量面积

clear

清除当前绘图状态及测量结果

var mapMeasure = new MapMeasure(map);
mapMeasure.clear(); // 清除