this.map = L.map('map').setView([51.505, -0.09], 13);

drawPolygon = () => {
let points = []; const polygon = new L.Polygon(points);
this.map.addLayer(polygon); this.map.on('mousedown', e => {
points.push([e.latlng.lat, e.latlng.lng]); this.map.on('mousemove', event => {
polygon.setLatLngs([...points,[event.latlng.lat, event.latlng.lng]])
});
}); this.map.on('dblclick', () => {
if (points.length) {
this.map.off('mousemove');
points = [];
}
});
};

Leaflet绘制多边形的更多相关文章

  1. leaflet简单例子,绘制多边形

    var crs = L.CRS.EPSG900913; var map = L.map('map', { crs: crs, width: '100%', height: '100%', maxZoo ...

  2. 用线框模式绘制多边形 glPolygonMode

    glPolygonMode(GL_FRONT_AND_BACK, GL_LINE); glBegin(GL_TRIANGLES);//开始以g_ViewMode模式绘制 glColor3ub(182. ...

  3. [WebGL入门]十四,绘制多边形

    注意:文章翻译http://wgld.org/.原作者杉本雅広(doxas),文章中假设有我的额外说明,我会加上[lufy:].另外,鄙人webgl研究还不够深入.一些专业词语,假设翻译有误,欢迎大家 ...

  4. canvas绘制多边形

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. leaflet计算多边形面积

    上一篇介绍了使用leaflet绘制圆形,那如何计算圆形的面积呢? 1.使用数学公式计算,绘制好圆形后,获取中心点以及半径即可 2.使用第三方工具计算,如turf.js. 这里turf的area方法入参 ...

  6. 【Silverlight】Bing Maps学习系列(五):绘制多边形(Polygon)图形(转)

    [Silverlight]Bing Maps学习系列(五):绘制多边形(Polygon)图形 Bing Maps Silverlight Control支持用户自定义绘制多边形(Polygon)图形, ...

  7. 浅谈使用canvas绘制多边形

    本文主要使用坐标轴的使用来绘制多边形,点位则都是在y轴上寻找,这种方法能够更好的理解图形与修改. //id为html里canvas标签的属性id: //x,y为坐标轴的起始位置,因为canvas默认坐 ...

  8. JS实现鼠标点击爱心&绘制多边形&每日一言功能

    本篇文章主要介绍我的个人博客 程序猿刘川枫 中页面使用的美化功能(基于JS实现): 1.鼠标点击出现不同颜色爱心特效 2.页面浮动多边形跟随鼠标移动 3.每日一言功能 1.鼠标点击出现爱心特效 经常在 ...

  9. [javascript svg fill stroke stroke-width points polygon属性讲解] svg fill stroke stroke-width points polygon绘制多边形属性并且演示polyline和polygon区别讲解

    <!DOCTYPE html> <html lang='zh-cn'> <head> <title>Insert you title</title ...

随机推荐

  1. MongoDB 系列(一) C# 类似EF语法简单封装

    之前写过一篇关于MongoDB的封装 发现太过繁琐 于是打算从新写一篇简易版 1:关于MongoDB的安装请自行百度,进行权限认证的时候有一个小坑,3.0之后授权认证方式默认的SCRAM-SHA-1模 ...

  2. POJ 2114 点分治

    思路: 点分治 //By SiriusRen #include <cstdio> #include <cstring> #include <algorithm> u ...

  3. C#调用GPG命令进行加密解密文件操作

    public void GPG() { string password = "1234567890"; System.Diagnostics.ProcessStartInfo ps ...

  4. 【参考】JDBC执行存储过程的四种情况

    [1].只有输入IN参数,没有输出OUT参数 [2].既有输入IN参数,也有输出OUT参数,输出是简单值(非列表) [3].既有输入IN参数,也有输出OUT参数,输出是列表 [4].输入输出参数是同一 ...

  5. HDU 1285 确定比赛名次【拓扑排序】

    题意:中文的题目-----这道题让我终于明白了那个break的作用---因为题目中有这一句“符合条件的排名可能不是唯一的,此时要求输出时编号小的队伍在前”@_@ #include<iostrea ...

  6. C语言-100加减求和

    ----------------------------度娘的思路------------------------------------------------------ Action() { / ...

  7. asp.net core 与EFcore 入门

    什么是EFcore? Entity Framework (EF) Core 是轻量化.可扩展和跨平台版的常用 Entity Framework 数据访问技术,EF Core 可用作对象关系映射程序 ( ...

  8. 使用Python进行多线程检查.moe三位剩余有效域名

    翻看博客看到一段不错的代码 虽然近期没有购买域名的需求 不过日后有购买域名的需求的话 稍作修改直接使用还是很方便的 import threading import requests import js ...

  9. [agc015c]nuske vs phantom thnook

    题意: 有一个n*m的网格图,每个格子是蓝色或白色.四相邻的两个格子连一条边,保证蓝格子构成一个森林. 有q组询问,每次询问给出一个矩形,问矩形内蓝格子组成的联通块个数. $1\leq n,m\leq ...

  10. sshd修改监听端口

    vi /etc/sshd/sshd_config ListenAddress 0.0.0.0 #修改为 ListenAddress 192.168.0.1 #代表只监听192.168.0.1的SSH请 ...