| | |
| | | <view class=" main"> |
| | | <view class="searchMain mb-35 mt-38"> |
| | | <view class="search fs-27 "> |
| | | <text class="mr-35 ml-50">成都市</text> |
| | | <text class="mr-35 ml-50">{{ city }}</text> |
| | | <image class="w-17 h-8 mr-35" src="/static/location/toleft.png" mode=""></image> |
| | | <image class="w-31 h-31 mr-13" src="/static/location/search.png" mode=""></image> |
| | | <input class="flex1" v-model="keyword" placeholder="搜索小区/写字楼等" |
| | |
| | | map: null, |
| | | uid: 0, |
| | | keyword: '', |
| | | markers:[], |
| | | locationList: [], |
| | | city: '攀枝花市' |
| | | }; |
| | | }, |
| | | methods: { |
| | | clearMarkers() { |
| | | // 清除所有标点 |
| | | this.markers.forEach((marker) => { |
| | | this.map.removeOverlay(marker); |
| | | }); |
| | | this.markers = []; // 清空存储标点的数组 |
| | | }, |
| | | |
| | | back() { |
| | | uni.navigateBack() |
| | | }, |
| | |
| | | }, |
| | | onReady() { |
| | | this.map = new BMapGL.Map("container"); // 创建地图实例 |
| | | console.log(this.map); |
| | | // uni.getLocation({ |
| | | // type: 'wgs84', |
| | | // success: (res) => { |
| | | navigator.geolocation.getCurrentPosition(success, error, options); |
| | | |
| | | uni.getLocation({ |
| | | type: 'wgs84', |
| | | success: (res) => { |
| | | console.log(res, 'resgetLocation'); |
| | | this.longitude = res.longitude; |
| | | this.latitude = res.latitude; |
| | | var point = new BMapGL.Point(res.longitude, res.latitude); // 创建点坐标 |
| | | this.map.enableScrollWheelZoom(true); |
| | | this.map.centerAndZoom(point, 12); |
| | | var marker = new BMapGL.Marker(point); |
| | | this.map.addOverlay(marker); |
| | | this.markers.push(marker); |
| | | var myGeo = new BMapGL.Geocoder(); |
| | | // 根据坐标得到地址描述 |
| | | myGeo.getLocation(new BMapGL.Point(res.longitude, res.latitude), (result) => { |
| | | console.log(result, 'result'); |
| | | this.locationList = result.surroundingPois.map((item, index) => { |
| | | item.id = index + 1 |
| | | return item |
| | | }) |
| | | function success(position) { |
| | | const latitude = position.coords.latitude; |
| | | const longitude = position.coords.longitude; |
| | | const accuracy = position.coords.accuracy; // 精度,单位米 |
| | | |
| | | }) |
| | | this.map.addEventListener('click', (e) => { |
| | | this.clearMarkers() |
| | | var mercator = this.map.lnglatToMercator(e.latlng.lng, e.latlng.lat); |
| | | this.latitude = e.latlng.lat |
| | | this.longitude = e.latlng.lng |
| | | var point = new BMapGL.Point(e.latlng.lng, e.latlng.lat); |
| | | this.map.centerAndZoom(point, 12); |
| | | var myGeo = new BMapGL.Geocoder(); |
| | | // 根据坐标得到地址描述 |
| | | myGeo.getLocation(new BMapGL.Point(e.latlng.lng, e.latlng.lat), (result) => { |
| | | console.log(result, 'result'); |
| | | this.locationList = result.surroundingPois.map((item, index) => { |
| | | item.id = index + 1 |
| | | return item |
| | | }) |
| | | console.log(`纬度: ${latitude}, 经度: ${longitude}, 精度: ${accuracy}`); |
| | | // 在这里可以使用获取到的经纬度信息,例如在地图上显示位置等。 |
| | | } |
| | | |
| | | }) |
| | | var marker = new BMapGL.Marker(point); |
| | | this.map.addOverlay(marker); |
| | | this.markers.push(marker); |
| | | }); |
| | | function error(err) { |
| | | console.log(err); |
| | | switch (err.code) { |
| | | case err.PERMISSION_DENIED: |
| | | console.error("用户拒绝了位置请求。"); |
| | | break; |
| | | case err.POSITION_UNAVAILABLE: |
| | | console.error("无法获取位置信息。"); |
| | | break; |
| | | case err.TIMEOUT: |
| | | console.error("位置请求超时。"); |
| | | break; |
| | | default: |
| | | console.error("未知错误。"); |
| | | } |
| | | } |
| | | |
| | | const options = { |
| | | enableHighAccuracy: true, // 启用高精度定位 |
| | | timeout: 5000, // 5 秒超时 |
| | | maximumAge: 0 // 不使用缓存 |
| | | }; |
| | | let res = { |
| | | longitude: 101.725544, |
| | | latitude: 26.587259 |
| | | } |
| | | this.longitude = res.longitude; |
| | | this.latitude = res.latitude; |
| | | var point = new BMapGL.Point(res.longitude, res.latitude); // 创建点坐标 |
| | | this.map.enableScrollWheelZoom(true); |
| | | this.map.centerAndZoom(point, 12); |
| | | var marker = new BMapGL.Marker(point); |
| | | this.map.addOverlay(marker); |
| | | var myGeo = new BMapGL.Geocoder(); |
| | | // 根据坐标得到地址描述 |
| | | myGeo.getLocation(new BMapGL.Point(res.longitude, res.latitude), (result) => { |
| | | this.locationList = result.surroundingPois.map((item, index) => { |
| | | item.id = index + 1 |
| | | return item |
| | | }) |
| | | |
| | | }) |
| | | this.map.addEventListener('click', (e) => { |
| | | var mercator = this.map.lnglatToMercator(e.latlng.lng, e.latlng.lat); |
| | | this.latitude = e.latlng.lat |
| | | this.longitude = e.latlng.lng |
| | | var point = new BMapGL.Point(e.latlng.lng, e.latlng.lat); |
| | | this.map.centerAndZoom(point, 12); |
| | | var myGeo = new BMapGL.Geocoder(); |
| | | // 根据坐标得到地址描述 |
| | | myGeo.getLocation(new BMapGL.Point(e.latlng.lng, e.latlng.lat), (result) => { |
| | | console.log(result, 'result'); |
| | | this.locationList = result.surroundingPois.map((item, index) => { |
| | | item.id = index + 1 |
| | | return item |
| | | }) |
| | | |
| | | }) |
| | | var marker = new BMapGL.Marker(point); |
| | | this.map.addOverlay(marker); |
| | | }); |
| | | // }, |
| | | // error:err=>{ |
| | | // console.log(err,'err'); |
| | | // } |
| | | // }); |
| | | |
| | | } |
| | | } |