Leaflet绘制多边形
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绘制多边形的更多相关文章
- leaflet简单例子,绘制多边形
var crs = L.CRS.EPSG900913; var map = L.map('map', { crs: crs, width: '100%', height: '100%', maxZoo ...
- 用线框模式绘制多边形 glPolygonMode
glPolygonMode(GL_FRONT_AND_BACK, GL_LINE); glBegin(GL_TRIANGLES);//开始以g_ViewMode模式绘制 glColor3ub(182. ...
- [WebGL入门]十四,绘制多边形
注意:文章翻译http://wgld.org/.原作者杉本雅広(doxas),文章中假设有我的额外说明,我会加上[lufy:].另外,鄙人webgl研究还不够深入.一些专业词语,假设翻译有误,欢迎大家 ...
- canvas绘制多边形
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- leaflet计算多边形面积
上一篇介绍了使用leaflet绘制圆形,那如何计算圆形的面积呢? 1.使用数学公式计算,绘制好圆形后,获取中心点以及半径即可 2.使用第三方工具计算,如turf.js. 这里turf的area方法入参 ...
- 【Silverlight】Bing Maps学习系列(五):绘制多边形(Polygon)图形(转)
[Silverlight]Bing Maps学习系列(五):绘制多边形(Polygon)图形 Bing Maps Silverlight Control支持用户自定义绘制多边形(Polygon)图形, ...
- 浅谈使用canvas绘制多边形
本文主要使用坐标轴的使用来绘制多边形,点位则都是在y轴上寻找,这种方法能够更好的理解图形与修改. //id为html里canvas标签的属性id: //x,y为坐标轴的起始位置,因为canvas默认坐 ...
- JS实现鼠标点击爱心&绘制多边形&每日一言功能
本篇文章主要介绍我的个人博客 程序猿刘川枫 中页面使用的美化功能(基于JS实现): 1.鼠标点击出现不同颜色爱心特效 2.页面浮动多边形跟随鼠标移动 3.每日一言功能 1.鼠标点击出现爱心特效 经常在 ...
- [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 ...
随机推荐
- (三)Fegin声明式服务调用
上一篇,讲了SpringClound中的消费者采用Ribbon+Rest来实现,这回我们用组件Feign来实现服务的消费者,Fegin中也是默认集成了Ribbon的;和Eureka结合也能实现负载均衡 ...
- 整数转罗马数字 C++实现 java实现 leetcode系列(十二)
罗马数字包含以下七种字符: I, V, X, L,C,D 和 M. 字符 数值 I 1 V 5 X 10 L 50 C 100 D 500 M 1000 例如, 罗马数字 2 写做 II ,即为两个并 ...
- mysql实战45讲 (三) 事务隔离:为什么你改了我还看不见 极客时间读书笔记
提到事务,你肯定不陌生,和数据库打交道的时候,我们总是会用到事务.最经典的例子就是转账,你要给朋友小王转100块钱,而此时你的银行卡只有100块钱. 转账过程具体到程序里会有一系列的操作,比如查询余额 ...
- Kali linux 2016.2(Rolling)的利用MSF攻击windows小案例(exploits + payloads + taegets)(博主推荐)
不多说,直接上干货! 本博文举的例,是利用远程溢出windows服务器. Exploit/windows/smb/ms08_067_netapi. Payload : windows/shell ...
- 如何给table的指定td进行css样式改变
td:nth-child(){background-color:#; color:#fff;}/*把第3个td的背景设为黑色*/ :nth-child()不止可以给table指定样式 p标签页是可以的 ...
- CentOS-1810系统DHCP服务器ISC DHCP软件配置说明
DHCP 全称Dynamic Host configuration protocol, 动态主机配置协议.是一个局域网的网络协议,使用UDP协议工作,它可以为客户机自动分配IP地址.子网掩码以及缺省网 ...
- [NOI2015]品酒大会(后缀树+DP)
后缀自动机有一个性质. 就是如果倒建SAM两个串的lcp就是这两个串的结束节点的LCA. 然后就可以愉快的跑DP了. 对于每一个后缀树上的节点\(u\),它对\(len[u]\)的贡献是\(\sum_ ...
- [USACO4.2]完美的牛栏The Perfect Stall
题目:USACO Training 4.2(在官网上提交需加文件输入输出).洛谷P1894. 题目大意:有n头奶牛m个牛栏,每头牛只会在自己喜欢的牛栏里产奶,问一次最多有多少奶牛能产奶. 解题思路:二 ...
- 企业级URL检测脚本
#!/bin/bash #检查web url 是否正常 . /etc/init.d/functions #引用系统函数库 #判断传参个数是否为一个 function usage(){ echo $&q ...
- WPF 内存释放
原文:WPF 内存释放 在WPF 项目中引用到Transitionals 实现图片转场特效,发现每次图片转场内存都会增加,在每次转场后进行内存压缩 记录 解决方案如下: GC.Collect(); G ...