js开源定位插件（完全免费）

插件背景

相信很多人最近都收到某度等地图应用商发来的通知，因为政策等原因，地图应用的使用需要商业授权，而我司之前使用的某度地图商业授权一年要五万！然而绝大部分公司使用的功能仅仅只是浏览器定位，省市区三级联动查询等简单的功能，这样的价格对公司来说虽说不高，但是能省当然是最好的，于是这款个人开源的浏览器定位插件就诞生了（已服务于本人公司业务）。

ps:其他地图应用是否会进行收费暂时不知，不过本项目不需要申请与维护地图应用key，也没有调用次数限制与并发限制，当然也可以收藏下本项目当做备用方案以备不时之需。毕竟免费，胜过所有，嘿嘿。

插件地址

npm地址:https://www.npmjs.com/package/@pikaz/location

github地址:https://github.com/pikaz-18/pikaz-location.git

介绍

供中国地区使用的js定位插件

特性：

支持浏览器h5定位、ip定位、经纬度查询地址、省市区三级联动列表搜索经纬度查询地址getAddress函数可配合第三方定位使用，如微信定位只能获取经纬度，可使用getAddress方法传入经纬度获取具体地址信息定位信息文件已做压缩处理，如果有启用gzip时定位大约只会花费几十k

ps：

由于浏览器限制，http域名的网页使用h5定位可能会出现问题，如定位不准、禁止定位等，如果想要定位结果更加精准，最好使用https域名；

该插件的定位文件存放在第三方cdn中，若想存放至自己的cdn上，则可参考setConfig函数使用方法介绍

demo示例 demo代码 安装 with npm or yarn yarn add @pikaz/locationnpm i -S @pikaz/location import { getLocation} from "@pikaz/location" with cdn 或者 const { getLocation} = window.pikazLocation 方法函数 方法名说明参数默认参数值setConfig设置全局默认参数；timeout为所有定位函数超时时间，url为定位文件cdn地址，如：https://cdn.jsdelivr.net/npm/@pikaz/location/lib或https://unpkg.com/@pikaz/location/lib{timeout: Number/选填, url: String/选填}{timeout:3000, url:“https://unpkg.com/@pikaz/location/lib”}getLocation默认定位函数，优先使用html5定位，html5定位失败，则会自动切换为ip定位；timeout为超时时间，enableHighAccuracy为是否开启高精度定位（开启设备gps定位，但所需时间更久）{timeout: Number/选填, enableHighAccuracy: Boolean/选填}{timeout:3000, enableHighAccuracy:false}getH5Location指定使用html5定位函数；timeout为超时时间，enableHighAccuracy为是否开启高精度定位（开启设备gps定位）{timeout: Number/选填, enableHighAccuracy: Boolean/选填}{timeout:3000, enableHighAccuracy:false}getIpLocation指定使用ip定位函数; timeout为超时时间{timeout: Number/选填}{timeout:3000}getAddress根据经纬度获取具体地址；latitude为纬度，longitude为经度{ latitude: Number/必填, longitude : Number/必填}{ latitude: 0, longitude : 0}searchList省市区三级联动，传入地区行政编码返回下级地区列表信息，code为地区编码，不传则为查询省级列表code: String/选填code:"" 方法示例 setConfig

说明：设置全局默认参数，可把该项目的根目录下的static文件夹上传至至您的oss或服务器上，将static所在的地址作为url传入，如oss上的static文件夹可通过https://xxx.com/file/static访问，则url可传入https://xxx.com/file，若不设置，则url默认使用https://cdn.jsdelivr.net/npm/@pikaz/location/lib地址（第三方cdn可能不稳定，最好自行上传定位文件）

import { setConfig} from "@pikaz/location"setConfig({ timeout: 3000, url: "https://unpkg.com/@pikaz/location/lib"}) getLocation

说明：默认定位函数，html5定位推荐使用https协议的域名，若为http，则html5定位可能出现定位不准确，开启高精度定位会更加耗时

import { getLocation} from "@pikaz/location"getLocation({ timeout: 3000, enableHighAccuracy: true}).then(res => { console.log(res) // 返回值结构: { // latitude:0//当期定位的纬度, // longitude:0//当期定位的经度, // province: ""//当期定位的省级单位名称, // city: ""//当期定位的市级单位名称, // district: ""//当期定位的区、县级单位名称, // code: ""//当前定位的行政编码, // type: ""//定位类型：h5或ip, // details: {//当前地址详情 // province: { // code: "",//当前定位的省级单位行政编码, // location: {longitude:0,latitude:0},//当前定位的省级单位的经纬度 // name: "",//当前定位的省级单位名称, // pinyin: ""//当前定位的省级单位名称拼音 // }, // city: { // code: "",//当前定位的市级单位行政编码, // location: {longitude:0,latitude:0},//当前定位的市级单位的经纬度 // name: "",//当前定位的市级单位名称, // pinyin: ""//当前定位的市级单位名称拼音 // }, // district: { // code: "",//当前定位的区县级单位行政编码, // location: {longitude:0,latitude:0},//当前定位的区县级单位的经纬度 // name: "",//当前定位的区县级单位名称, // pinyin: ""//当前定位的区县级单位名称拼音 // }, // }}).catch(err => { console.log(err)}) getH5Location

说明：html5定位函数，html5定位推荐使用https协议的域名，若为http，则html5定位可能出现定位不准确，开启高精度定位会更加耗时；该函数只会返回经纬度，若需具体地址，可配合getAddress函数获取具体地址

import { getH5Location} from "@pikaz/location"getH5Location({ timeout: 3000, enableHighAccuracy: true}).then(res => { console.log(res) // 返回值结构: { // latitude:0//当期定位的纬度, // longitude:0//当期定位的经度, // }}).catch(err => { console.log(err)}) getIpLocation

说明：ip定位函数，ip定位相比html5定位精准度更差，只精确到市（区县数据不准确，有时候市级定位也不准确，这是ip定位的缺陷），但是若用户拒绝定位授权时，则可以使用ip定位作为兜底方案；该函数只会返回经纬度，若需具体地址，可配合getAddress函数获取具体地址

import { getIpLocation} from "@pikaz/location"getIpLocation({ timeout: 3000}).then(res => { console.log(res) // 返回值结构: { // latitude:0//当期定位的纬度, // longitude:0//当期定位的经度, // }}).catch(err => { console.log(err)}) getAddress

说明：根据经纬度查询具体定位函数

import { getAddress} from "@pikaz/location"getAddress({ latitude: 40.0402718, longitude: 116.2735831}).then(res => { console.log(res) // 返回值结构: { // latitude:0//当期定位的纬度, // longitude:0//当期定位的经度, // province: ""//当期定位的省级单位名称, // city: ""//当期定位的市级单位名称, // district: ""//当期定位的区、县级单位名称, // code: ""//当前定位的行政编码, // details: {//当前地址详情 // province: { // code: "",//当前定位的省级单位行政编码, // location: {longitude:0,latitude:0},//当前定位的省级单位的经纬度 // name: "",//当前定位的省级单位名称, // pinyin: ""//当前定位的省级单位名称拼音 // }, // city: { // code: "",//当前定位的市级单位行政编码, // location: {longitude:0,latitude:0},//当前定位的市级单位的经纬度 // name: "",//当前定位的市级单位名称, // pinyin: ""//当前定位的市级单位名称拼音 // }, // district: { // code: "",//当前定位的区县级单位行政编码, // location: {longitude:0,latitude:0},//当前定位的区县级单位的经纬度 // name: "",//当前定位的区县级单位名称, // pinyin: ""//当前定位的区县级单位名称拼音 // }, // }}).catch(err => { console.log(err)}) searchList

说明：省市区三级联动，传入对应行政单位编码，获取下级行政单位列表；不传行政单位编码默认获取省级单位列表

import { searchList} from "@pikaz/location"searchList("110000").then(res => { console.log(res) // 返回值结构: [ // {"code":"410100",//该行政单位编码 // "name":"郑州市",//该行政单位名称 // "pinyin":"zhengzhou",//该行政单位名称拼音 // "location":{"latitude":34.74725,"longitude":113.62493}//该行政单位经纬度 // ]}).catch(err => { console.log(err)}) 最后

由于项目可能存在着不足，若在使用中出现问题，欢迎前往issue或掘金下方评论区评论（最好在github中提问，因为github有邮件提醒方便本人及时查看并修正问题）

如果觉得对您有帮助的话，欢迎前往github帮我点个star吧，谢谢！