摘要：数组格式普通对象格式二者互相转换这两个函数会根据当前地图的缩放程度转换地理点与像素点，返回值分别是和。方法返回值描述在同一缩放级别下，将地理坐标转换为像素坐标。
Leaflet
an open-source JavaScript library for mobile-friendly interactive maps
Leaflet中有两种表示坐标点的数据结构，一种是最常用的LatLng，另一种则是Point。
L.LatLngLatLng是表示一个具有纬度(lat)和经度(lng)的地理坐标(以度为单位)。LatLng的以下组织形式均可用于leaflet的方法（除非有特殊说明）：
map.panTo([50, 30]); //数组
map.panTo({lon: 30, lat: 50}); //简单对象
map.panTo({lat: 50, lng: 30}); //简单对象
map.panTo(L.latLng(50, 30)); //函数
var latlng = L.latLng(50.5, 30.5);
| 构造函数 | 描述 |
|---|---|
| L.latLng( |
通过给定的纬度和经度创建一个地理坐标点（海拔高度是可选的，以米为单位） |
| L.latLng( |
数组格式表示的地理坐标 |
| L.latLng( coords) | 普通对象表示的地理坐标 |
Point指的是用像素表示x和y的坐标点。Point的以下组织形式均可用于leaflet的方法和选项（除非有特殊说明）：
map.panBy([200, 300]); //数组 map.panBy(L.point(200, 300)); //函数
var point = L.point(200, 300);
| 构造函数 | 描述 |
|---|---|
| L.point( |
用给定的x和y坐标创建一个Point对象。如果可选项round设置为true，则舍入x和y值。 |
| L.point( |
数组格式 |
| L.point( coords) | 普通对象格式 |
这两个函数会根据当前地图的缩放程度（zoom）转换地理点与像素点，返回值分别是Point和latLng。
| 方法 | 返回值 | 描述 |
|---|---|---|
| latLngToPoint( |
Point | 在同一缩放级别下，将地理坐标转换为像素坐标。 |
| pointToLatLng( |
LatLng | 在同一缩放级别下，将像素坐标转换为地理坐标。 |
由于LatLng和Point均不是继承于Leaflet的L.Class对象，所以它们都不能拓展新的类，也不能通过include函数为其添加新的方法。
二者不同点LatLng是描述经纬度的坐标类，代表具有一定纬度和经度的地理点，而Point描述的是在屏幕上位置的像素点，主要用于屏幕交互事件上，比如鼠标单击双击事件，在屏幕上的触控滑动事件等，即当鼠标事件发生时，相对于地图图层或地图容器的点的像素坐标位置。在有些情况下，需要通过上述两个函数方法对二者进行相互转换。
如何在地图上添加坐标点？ 既然L.LatLng和L.Point没有继承于L.Class,也就不会有相应的方法将坐标点添加进地图图层，那怎么办呢？
您可以尝试使用L.Layer父类下的L.Circle,通过它将坐标点添加进地图，使用方法如下：
var latLng = L.latLng(30.594331217463765, 114.28321838378906); //创建坐标点
L.circle(latLng, {radius:300,color: "red", fillColor:"#f03",fillOpacity:1}).addTo(map); //将坐标点添加进图层
注：将radius设置为0，在地图上则显示为一个点。为了方便您查看效果，将其设置为300。当然了，在这里的L.latlng只是一个保存坐标的作用。
上述内容有任何错误，欢迎留言指出，谢谢~
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/102376.html
摘要：简介纯在地图上进行操作坐标点路径曲线等的一个库只提供操作地图实际加载某个地图由开发者决定创建地图对象页面创建设置属性撑满整个屏幕设置中属性使用初始化地图对象为名字参数地图中心坐标位置参数地图加载级别数字越大地图加载越近为地图加载瓦片图层常用 简介 纯JavaScript,在地图上进行操作(坐标点,路径,曲线等)的一个库,只提供操作地图API,实际加载某个地图,由开发者决定 创建地图对象...
摘要：实际中我们可能会用到不同的地图，那么就对应到不同坐标系的转换，比如说，你有一份的数据服务，你要展现在百度或者高德地图上，这时候你就需要转换了。 地图坐标转换 LBS，基于位置的服务（Location Based Service)，近年来已经无处不在，尤其是我们前端，相信或多或少都有接触一些地图API服务，比如高德、百度啊、谷歌啊~但是用的时候可能看到下面这些字眼：比如BD09、火星坐标...
入门 Leaflet 之小 Demo 写在前面 ---- WebGIS 开发基础之 Leaflet GIS 基本概念：GIS、Map、Layer、Feature、Geometry、Symbol、Data（Point、Polyline、Polygon）、Renderer、Scale、Project、Coordinates； GIS 开发概述：架构模式、常用平台和 SDK、二维三维 使用 Lea...
摘要：提示在官方教程的基础上，增加了一些注释以及链接，可帮助读者更好的学习有不正确或有待改进的地方，欢迎批评指出。明确容器的高度。首先我们将初始化地图，通过选定的地理坐标设置地图视角以及缩放级别。 提示：在Leaflet官方教程的基础上，增加了一些注释以及链接，可帮助读者更好的学习Leaflet,有不正确或有待改进的地方，欢迎批评指出。 Leaflet an open-source Java...
摘要：百度地图创建标签进行加载使用百度地图需要百度地图添加扩展，用于让百度地图支持地图可能会遇见两个问题地图图片错位忘记加载中使用的一个主要问题是默认图标的加载问题，详见另外也可以考虑使用动态创建标签的方法，类似百度地图加载百度地图因为本身支持的 webpack+百度地图 创建 script标签进行加载 export function MP(ak){ return new Prom...
阅读 1047·2021-10-08 10:05
阅读 2880·2021-09-26 10:10
阅读 2251·2021-09-08 09:36
阅读 705·2019-08-30 15:55
阅读 384·2019-08-26 11:51
阅读 284·2019-08-23 18:10
阅读 3612·2019-08-23 15:39
阅读 538·2019-08-23 14:50
