electron获取位置坐标信息的方法小结
作者：toobeloong
这篇文章给大家详细介绍了electron 如何获取位置坐标信息,文中通过代码示例给大家介绍的非常详细,对大家的学习或工作有一定的帮助,需要的朋友可以参考下
前端获取位置坐标信息，有以下几种方法：
1.通过原生方法获取
优点：自定随意编写逻辑
缺点：需要授权，或者某些场景没办法获取
function handlePosition (position: GeolocationPosition) {
console.debug(position);
/*
{
coords: {
accuracy: 1804475.2390180232
altitude: null
altitudeAccuracy: null
heading: null
latitude: 123.123
longitude: 123.123
speed: null
}
}
*/
}
function handlePositionError (e: GeolocationPositionError) {
switch (e.code) {
case e.PERMISSION_DENIED:
logger.info('位置服务被拒绝', e.message);
break;
case e.POSITION_UNAVAILABLE:
logger.info('暂时获取不到位置信息', e.message);
break;
case e.TIMEOUT:
logger.info('获取信息超时', e.message);
break;
default:
logger.info('未知错误', e.message);
break;
}
};
function setLocation () {
const options = {
//是否使用高精度设备，如GPS。默认是true
enableHighAccuracy: true,
//超时时间，单位毫秒，默认为0
timeout: 5000,
//使用设置时间内的缓存数据，单位毫秒
//默认为0，即始终请求新数据
//如设为Infinity，则始终使用缓存数据
maximumAge: 0,
};
if (navigator.permissions) {
navigator.permissions.query({ name: 'geolocation' }).then(function (result) {
console.debug('permissions:', result.state);
if (result.state === 'granted') {
navigator.geolocation.getCurrentPosition(handlePosition, handlePositionError, options);
} else if (result.state === 'prompt') {
navigator.geolocation.getCurrentPosition(handlePosition, handlePositionError, options);
} else if (result.state === 'denied') {
alert('Permission denied. Please allow location access in your browser settings.');
}
});
} else {
navigator.geolocation.getCurrentPosition(handlePosition, handlePositionError, options);
}
}2.直接使用第三方服务
例如：百度地图等一些线上的服务商，只要你自己在使用过程当中没什么限制。
以百度为例，如果是直接自己创建ak，通过
https://api.map.baidu.com/location/ip?ip=***&coor=bd09ll&ak=***
去调用的话，精度不高，只去到所在城市的中心点，所以基本没啥用，想要提高精度，增加自己的投入就好。
还有一种，就是直接用map的api:
https://map.baidu.com/?qt=ipLocation&t=${Date.now()}暂时来说，还没遇到使用上的限制，直接通过axios去调用即可（ajax等其他方式调用也行，get就好了）
function setLocationByBaidu(){
axios.get(`https://map.baidu.com/?qt=ipLocation&t=${Date.now()}`).then(response => {
const gcj02Lng = response.data.rgc.result.location.lng;
const gcj02Lat = response.data.rgc.result.location.lat;
// 转换成 gcj02 坐标
const gcj02 = coordtransform.bd09togcj02(gcj02Lng, gcj02Lat);
// 再转换为 wgs84 坐标
const wgs84 = coordtransform.gcj02towgs84(gcj02[0], gcj02[1]);
console.debug('db09 坐标：', response.data.rgc.result.location.lng, response.data.rgc.result.location.lat);
console.debug('gcj02 坐标：', gcj02);
console.debug('WGS84 坐标：', wgs84);
});
});
}上面的方法使用到了coordtransform进行坐标转换，当你直接调用接口获取数据，在使用的时候发现坐标不是很准确，多半是需要转换一下之后再使用。
npm安装一下就好
npm i coordtransform
关于electron应用获取坐标数据，navigator的话，需要https或者是携带证书，搞起来比较麻烦，直接使用第三方服务就比较简单了，上面的方法都是现在常用的获取坐标的方式，可以参考一下，有问题大家不妨讨论讨论。
以上就是electron获取位置坐标信息的方法小结的详细内容，更多关于electron获取坐标信息的资料请关注脚本之家其它相关文章！