//地图级别改变时发生
map.on("zoomend", function (e) {
var zoom_val = e.target.getZoom();
map_drag();;
});
//拖动地图时发生
map.on("moveend", function (e) {
map_drag();;
});

function map_drag() {
//左下角坐标(西南方)
var leftdown = map.getBounds().getSouthWest().lng + "," + map.getBounds().getSouthWest().lat;
L.circleMarker([map.getBounds().getSouthWest().lat, map.getBounds().getSouthWest().lng], { fillColor: "#f00", radius: 10 }).bindLabel("左下角坐标" + leftdown, { direction: 'right', noHide: true }).addTo(map);
//右上角坐标(东北方向)
var rightdown = map.getBounds().getNorthEast().lng + "," + map.getBounds().getNorthEast().lat;
L.circleMarker([map.getBounds().getNorthEast().lat, map.getBounds().getNorthEast().lng], { fillColor: "#f00", radius: 10 }).bindLabel("右上角坐标" + rightdown, { direction: 'left', noHide: true }).addTo(map);
//var strText = "当前地图级别:" + zoom_val + " 左下角坐标:" + leftdown + " 右下角坐标:" + rightdown;
//左上角:西北方
var leftdown = map.getBounds().getNorthWest().lng + "," + map.getBounds().getNorthWest().lat;
L.circleMarker([map.getBounds().getNorthWest().lat, map.getBounds().getNorthWest().lng], { fillColor: "#f00", radius: 10 }).bindLabel("左上角坐标" + leftdown, { direction: 'right', noHide: true }).addTo(map);

//右下角:东南方
var leftdown = map.getBounds().getSouthEast().lng + "," + map.getBounds().getSouthEast().lat;
L.circleMarker([map.getBounds().getSouthEast().lat, map.getBounds().getSouthEast().lng], { fillColor: "#f00", radius: 10 }).bindLabel("右下角坐标" + leftdown, { direction: 'left', noHide: true }).addTo(map);

}

Leaflet获取可视范围内4个顶点的更多相关文章

  1. GMap获取可视范围内四个角的坐标

    原理: 先获取控件的四个顶点,逐一将其转换成经纬度坐标. private void GetBonds() { //左上↖ PointLatLng pLeftTop = map1.FromLocalTo ...

  2. 获取页面内iframe里面的元素

    结构直接看图比较直接 这里window.frames获取的是iframe的数组 要记得给iframe加个ID才行 后面的记录会详细讲解 在父窗口获取页面内的iframe 里面的元素window.fra ...

  3. 递归获取字符串内的所有图片src地址

    // 递归调用获取字符串内所有的src地址 -(NSMutableArray *)getImageSrcUrlWithString:(NSString *)str withArray:(NSMutab ...

  4. js获取非行内样式

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. 利用webBrowser获取框架内Html页面内容

    原文:利用webBrowser获取框架内Html页面内容 利用webBrowser获取页面比较简单,MSDN下有示例,在这里不必多说. 可是一些 HTML 文档由“框架”构成,或可以存放它们自己独特 ...

  6. js 获取页面内链接

    今天有同学问如何用 JS 正则表达式获取一段文本中的超链接,并对超链接进行处理,想了几分钟,写了下面的代码: var re = /https?:\/\/[\w\.:~\-\d\/]+(?:\?[\w\ ...

  7. SQL 获取时间段内日期列表

    declare @start date,@end date; set @start='2010-01-01'; set @end='2010-02-01'; --获取时间段内日期列表 select [ ...

  8. javascript常用函数封装——运动、cookie、ajax、获取行内样式兼容写法、拖拽

    运动.cookie.ajax.获取行内样式兼容写法.拖拽封装大合集. //url,data,type,timeout,success,error function ajax(options){ //- ...

  9. .NET 获取类内成员的名称,以字符串形式显示

    需要做一个功能,显示类内的属性名和对应的值.比如有类 Public Class SupervisedParams     Public TestMode As string     Public Ti ...

随机推荐

  1. Android手机camera和IMU的标定

    https://qingsimon.github.io/post/2018-12-28-android%E6%89%8B%E6%9C%BA%E7%9B%B8camera%E5%92%8Cimu%E7% ...

  2. mysql-cluster集群配置

    环境: centos7:192.168.1.16,192.168.1.170 mysql-cluster-community-7.6.8-1.el7.x86_64.rpm-bundle.tar 安装: ...

  3. Android的几种Manager

    电话管理器TelephoneManager 第一个实例是获取网络和SIM卡信息:界面是一个列表,这里省略,Java代码如下: public class MainActivity extends Act ...

  4. Babylon.js demo

    demo地址   访问demo  全屏试试  感觉很棒 在线文档  搜索:Default rendering pipeline demo源码在线调试地址

  5. Mybatis+Mysql逆向工程

    目录结构: pom文件: <?xml version="1.0" encoding="UTF-8"?> <project xmlns=&quo ...

  6. 【Python全栈-CSS】CSS实现网页背景图片自适应全屏

    CSS实现网页背景图片自适应全屏 功能:实现能自适应屏幕大小又不会变形的背景大图,而且背景图片不会随着滚动条滚动而滚动. 以下是用CSS实现的方法: <html> <head> ...

  7. Linux基础命令2

    1.修改网络状态: 1).Cd  /etc/sysconfig/network-scripts/network-scripts 2).vi ifcfg-eth0   编辑  onboot=yes: 3 ...

  8. SpringMVC Web项目升级为Springboot项目(一)

    一.项目改为Springboot项目 1.将pom中所有spring相关依赖删除,添加spring-boot-starter及spring-boot-starter-web(项目中可能有其他sprin ...

  9. C#开启异步 线程的四种方式

    一.异步委托开启线程public static void Main(string[] args){ Action<int,int> a=add; a.BeginInvoke(3,4,nul ...

  10. box-sizing:border-boxing的使用

    <div class="box"></div> .box { margin-top: 200px; margin-left: 200px; backgrou ...