Leaflet.freedraw 插件画多边形

官方标配写法:

import L from 'leaflet';
import FreeDraw from 'leaflet-freedraw';

const map = new L.Map(node);
const freeDraw = new FreeDraw();

map.addLayer(freeDraw);复制代码

绘画操作函数:

freeDraw.on('markers', event => {
    console.log(event.latLngs);    //   返回所有多边形坐标
});复制代码

那么返回最新画的多边形坐标,咋整?

var latestPolygon = eventData.latLngs.filter(function (latLngs) {
          const json = JSON.stringify(latLngs)
          const has = !~seenPolygons.indexOf(json)
          has && seenPolygons.push(json)
          return has
        })        //   latestPolygon 就是最新的这个多边形坐标复制代码

画笔的功能 和 一些默认值

OptionDefaultResult
modeALLModifies the default mode.
smoothFactor0.3By how much to smooth the polygons.
elbowDistance10Factor to determine when to delete or when to append an edge.
simplifyFactor1.1By how much to simplify the polygon.
mergePolygonstrueWhether to attempt merging of polygons that intersect.
concavePolygontrueWhether to apply the concaving algorithm to the polygons.
maximumPolygonsInfinityMaximum number of polygons to be added to the map layer.
recreateAfterEditfalseWhether to recreate the polygons subsequent to them being modified.
notifyAfterEditExitfalseWhether to defer markers event until after exiting EDIT mode.
leaveModeAfterCreatefalseWhether to exit CREATE mode after each polygon creation.
strokeWidth2Size of the stroke when drawing.

指定画笔有哪些功能,咋整?

// Allow create, edit and delete.
freeDraw.mode(CREATE | EDIT | DELETE);

// Allow everything except create.
freeDraw.mode(ALL ^ CREATE);

// Allow nothing.
freeDraw.mode(NONE);复制代码

各种方法函数 :

MethodYieldsResult
createArrayCreates a polygon by passing an array of LatLngs
removevoidRemoves a polygon that is yielded from create
clearvoidClears all polygons from the current instance
modeNumberSets and retrieves the current mode.
cancelvoidCancels the current create action – such as on escape.
sizeNumberYields the number of polygons on the map layer.
allArrayEnumerate all of the current polygons for the current layer


备注:

单击多边形 可以 删掉




  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值