Skip to content

交互与工具

测量(Measure)

ts
import { Measure } from 'geoverse';

const measure = new Measure({
  target: map,
  kind: 'length', // 'length' 测距 | 'area' 测面
  callback: ({ target }) => console.log(target.result), // "1.2 km"
});
measure.start();
// measure.resetKind('area'); measure.clearResult(); measure.destroy();

绘制中实时显示分段长度,结果支持拖拽修改、点 ❌ 删除。

绘制(DrawTool)

ts
import { DrawTool } from 'geoverse';

const draw = new DrawTool({
  target: map,
  kind: 'polygon', // point | polyline | polygon | circle | square | rectangle
  config: { infoDiv: true }, // 绘制时显示面积/周长
  callback: ({ target }) => console.log(target.coordinates), // WGS-84 经纬度
});

要素编辑(FeatureEditor)

ts
import { FeatureEditor } from 'geoverse';

const editor = new FeatureEditor({ target: map, data: [feature] });
editor.on('adjust', (evt) => console.log('编辑中', evt));
editor.start(); // 显示顶点节点,可拖拽
editor.stop(); // 恢复原样式并派发 end 事件

轨迹回放(PathSimplifier)

ts
import { PathSimplifier } from 'geoverse';

const track = new PathSimplifier({
  mapObj: map,
  path: [{ longitude: 118.1, latitude: 24.4, gnssTime: '12:00' } /* ... */],
  tracePointsModePlay: 'animation', // animation 平滑 | skip 逐点
  showTracePoint: true,
});
track.on('move', (evt) => console.log(evt.data)); // 进度(索引/坐标/里程)
track.start();
// track.pause(); track.resume(); track.setSpeedUp(2); track.destroy();

大数据量轨迹在缩放时自动用 simplify-js 抽稀渲染节点。

文字避让(NameLayer)experimental

四方向碰撞避让的文字标签图层。当前避让算法在密集场景仍有已知瑕疵,API 可能调整:

ts
import { NameLayer } from 'geoverse';

const labels = new NameLayer({
  map,
  pointsArr: [{ position: [118.18, 24.49], text: '厦门' }],
  zoom: 10, // 低于该层级不显示
});
map.addLayer(labels);

轨迹抽稀(纯算法)

ts
import { compressLine } from 'geoverse';

const result = compressLine(points, { thinTarget: 75, smoothTarget: 20 });