前言
在移动互联网时代,其实许多的应用都有一些常见的需求,比如:周边的好友、附近的商家、附近的美食等等。为了方便地解决这些问题,kerplunk-group-nearby 诞生了。kerplunk-group-nearby 是一个 npm 包,是针对需要将地理位置服务整合到应用程序中的开发人员而提供的一个库。他可以方便地处理地理位置数据,同时通过计算后将数据转化为易于操作的数据格式,非常适合于构建周边好友、附近商家和其他基于地理位置的应用场景。
安装
在使用 kerplunk-group-nearby 之前,我们需要先安装他。通过以下指令可以完成安装:
npm install kerplunk-group-nearby
快速上手
在学会了如何安装 kerplunk-group-nearby 后,我们开始使用他吧。下面是一个简单的例子,帮助你快速上手 kerplunk-group-nearby。
首先,需要引入 kerplunk-group-nearby,这个非常简单,只需要在你写的文件中添加以下代码:
const GroupNearby = require('kerplunk-group-nearby')
注意: 为了让示例变得真实,我们需要进行如下操作:
- 安装 lodash,通过以下指令可以完成安装:
npm install lodash
。 - 创建一个简单的数据文件,数据文件内容如下:
const users = [ { id: 1, name: 'Tom', lat: 39.911433, lng: 116.390463 }, { id: 2, name: 'Jerry', lat: 39.905951, lng: 116.389958 }, { id: 3, name: 'Lucy', lat: 39.908889, lng: 116.397660 }, ]
现在,我们假设我们的需求是在某一个经纬度坐标下,查找所有距离该点 500 米以内的用户。接下来,我们可以利用如下方法使用 kerplunk-group-nearby:
const nearby = new GroupNearby(users, { latKey: 'lat', lngKey: 'lng', precision: 6 }) const usersInCircle500 = nearby.getPointsInCircle(39.910999, 116.391185, 500) console.log(usersInCircle500)
运行以上代码,你将得到以下输出结果:
[ { id: 1, name: 'Tom', lat: 39.911433, lng: 116.390463 }, { id: 2, name: 'Jerry', lat: 39.905951, lng: 116.389958 } ]
是不是很简单!
API 规范
new GroupNearby(data, options)
data
{Array} 需要处理的地理位置数据。- 每个数据的格式必须是
[Object { lat: Number, lng: Number }]
, lat 代表纬度, lng 代表经度。
- 每个数据的格式必须是
options
{Object} 配置项。latKey
{String} 每个对象中表示纬度的属性,默认为lat
。lngKey
{String} 每个对象中表示经度的属性,默认为lng
。precision
{Number} 位置坐标(纬度和经度)的小数位数,默认为 6。
新建 GroupNearby 实例,options 参数中可以配置 lat 和 lng 的 key,以及坐标的小数位数。
getPointsInCircle(lat, lng, radius)
lat
{Number} 中心点纬度。lng
{Number} 中心点经度。radius
{Number} 半径(单位:米)。
查找以中心点坐标 lat 、lng 为中心,半径为 radius 的圆内的位置点数据。
API 规范就介绍到这儿,是不是非常简单。
总结
我们学习了使用 kerplunk-group-nearby 的基本知识,快速上手,API 规范,相信现在你已经可以愉快地使用 kerplunk-group-nearby 构建自己的应用程序了。是不是觉得非常简单?如果你还有任何问题,记得查看官方文档哦!
来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/60066efd4c49986ca68d8a8c