见百度地图API调用文档
================
<!--引入百度地图API用于从浏览器获取当前经纬度--> <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=CoeKSNi3O0VoiopZZTwGA3HFT9AjcWGX"></script>
===============
<span><img src="./images/time.png"/> 距离{{userLocation}}km</span> <span><img src="./images/money.png"/> 配送费{{sendMoney}}元</span> <span><img src="./images/location.png"/> 预计时长{{sendTime}}min</span>
=========
//默认值 userLocation: 1, sendMoney: 1, sendTime: 1,
=======
getLocation() { let _this = this var map = new BMap.Map("allmap"); var geolocation = new BMap.Geolocation(); geolocation.getCurrentPosition(async function (r) { if (this.getStatus() == BMAP_STATUS_SUCCESS) { var mk = new BMap.Marker(r.point); map.addOverlay(mk); map.panTo(r.point); alert('您的位置,是否允许使用:' + r.point.lng + ',' + r.point.lat); const location = { //往后端传输经纬度 latitude: r.point.lng, longitude: r.point.lat } const res = await getLocation2(location) // alert(res.code) if (res.code === 1) { _this.userLocation = res.data _this.sendMoney = _this.userLocation * 1 _this.sendTime = _this.userLocation * 2 console.log(_this.userLocation + '千米') } } else { alert('failed' + this.getStatus()); } }); },
===========
//获取当前距离 function getLocation2(location) { return $axios({ 'url': '/dish/getLocation2', 'method': 'get', params: location }) }
==========
/** * 根据前端传回的经纬度,计算获取距离 */ @GetMapping("/getLocation2") public R getLocation(String latitude, String longitude) { log.info("经纬度" + latitude + "经纬度" + longitude); double a = Double.parseDouble(latitude); //用户当前坐标 GlobalCoordinates userSource = new GlobalCoordinates(Double.parseDouble(latitude), Double.parseDouble(longitude)); //店铺位置坐标 经纬度104.07274727经纬度30.57899372 GlobalCoordinates businessTarget = new GlobalCoordinates(104.07274728, 30.57899372); double meterDouble = getDistanceMeter(userSource, businessTarget, Ellipsoid.Sphere); int meter = (int) meterDouble; log.info("距离多少千米" + meter / 1000); return R.success(meter / 1000); }
===========================================
。。