| | |
| | | } |
| | | |
| | | |
| | | //获取当前定位 |
| | | var _rotate = 90; |
| | | var _marker = null; |
| | | var points = []; |
| | | |
| | | export function randomPoint() { |
| | | let t = 116.505348; |
| | | let e = 39.795592; |
| | | t += .01 * Math.random(); |
| | | e += .01 * Math.random(); |
| | | points.push([t, e]); |
| | | } |
| | | |
| | | |
| | | //实时获取定位 |
| | | export function getCurrentPosition() { |
| | | // setInterval(() => { |
| | | // randomPoint(); |
| | | // }, 1000) |
| | | |
| | | // console.log(points, '点位测试') |
| | | // _marker = createGPSMarker(points, _rotate); |
| | | // window.mapapi.addLayer(_marker) |
| | | |
| | | if (navigator.geolocation) { |
| | | navigator.geolocation.watchPosition((res) => { |
| | | let lat = res.coords.latitude; |
| | | let lon = res.coords.longitude; |
| | | _marker = createGPSMarker([lon, lat], _rotate); |
| | | window.mapapi.addLayer(_marker) |
| | | if (_GLOBAL.GPSMarker) { |
| | | window.mapapi.removeLayer(_GLOBAL.GPSMarker) |
| | | } |
| | | _GLOBAL.GPSMarker = createGPSMarker([lon, lat], _GLOBAL.rotate); |
| | | window.mapapi.addLayer(_GLOBAL.GPSMarker) |
| | | |
| | | }); |
| | | } |
| | | |
| | | } |
| | | |
| | | |
| | | //创建当前定位点 |
| | | export function createGPSMarker(position, rotate) { |
| | | const GPSMarkerLayer = new ol.layer.Vector({ |
| | | id: 'LocationPoint', |
| | |
| | | }; |
| | | |
| | | |
| | | //监听定位点跟随旋转 |
| | | export function listenDirection() { |
| | | window.addEventListener('deviceorientation', function (e) { |
| | | if (_marker) { |
| | | _rotate = e.alpha * (Math.PI / -180); |
| | | if (_GLOBAL.GPSMarker) { |
| | | _GLOBAL.rotate = e.alpha * (Math.PI / -180); |
| | | _marker.setStyle( |
| | | new ol.style.Style({ |
| | | image: new ol.style.Icon({ |
| | | anchor: [0.5, 0.5], |
| | | anchorOrigin: 'top-left', |
| | | src: require('@/assets/img/collection/mark.png'), |
| | | rotation: _rotate, |
| | | rotation: _GLOBAL.rotate, |
| | | anchorXUnits: "fraction", |
| | | anchorYUnits: "fraction", |
| | | scale: 0.5, |