| | |
|---|
| | | };
|
|---|
| | | },
|
|---|
| | | methods: {
|
|---|
| | |
|
|---|
| | | clearMarkers() {
|
|---|
| | | // 清除所有标点
|
|---|
| | | this.markers.forEach((marker) => {
|
|---|
| | |
|---|
| | |
|
|---|
| | | }
|
|---|
| | | })
|
|---|
| | | return
|
|---|
| | | uni.request({
|
|---|
| | | url: `https://api.map.baidu.com/place/v2/search`,
|
|---|
| | | method: 'GET',
|
|---|
| | | data: {
|
|---|
| | | query: this.keyword,
|
|---|
| | | location: `${this.latitude},${this.longitude }`,
|
|---|
| | | radius: 10000, // 搜索半径，单位：米
|
|---|
| | | output: 'json',
|
|---|
| | | ak: '3mHKIXMArjgIkgADzOlTYp4XssNSNkwr' // 替换为你自己的 AK
|
|---|
| | | },
|
|---|
| | | success: (res) => {
|
|---|
| | |
|
|---|
| | | if (res.data.status === 0) {
|
|---|
| | | this.searchResults = res.data.results;
|
|---|
| | | this.latitude = res.data.results[0].location.lat
|
|---|
| | | this.longitude = res.data.results[0].location.lng
|
|---|
| | | this.locationList = res.data.results.map((result, index) => {
|
|---|
| | |
|
|---|
| | | result.id = index + 1
|
|---|
| | |
|
|---|
| | | return result
|
|---|
| | | });
|
|---|
| | | }
|
|---|
| | | },
|
|---|
| | | fail: (err) => {
|
|---|
| | | console.error('搜索失败:', err);
|
|---|
| | | }
|
|---|
| | | });
|
|---|
| | | },
|
|---|
| | | },
|
|---|
| | | onLoad() {
|
|---|
| | |
|---|
| | | onReady() {
|
|---|
| | | this.map = new BMapGL.Map("container"); // 创建地图实例
|
|---|
| | | const that = this
|
|---|
| | | // uni.getLocation({
|
|---|
| | | // type: 'wgs84',
|
|---|
| | | // success: (res) => {
|
|---|
| | | navigator.geolocation.getCurrentPosition(success, error, options);
|
|---|
| | |
|
|---|
| | | function success(position) {
|
|---|
| | | const latitude = position.coords.latitude;
|
|---|
| | | const longitude = position.coords.longitude;
|
|---|
| | | const accuracy = position.coords.accuracy; // 精度，单位米
|
|---|
| | | // 在这里可以使用获取到的经纬度信息，例如在地图上显示位置等。
|
|---|
| | | uni.request({
|
|---|
| | | url: `https://api.map.baidu.com/geoconv/v2/?coords=${position.coords.longitude},${position.coords.latitude}&model=2&ak=3mHKIXMArjgIkgADzOlTYp4XssNSNkwr`,
|
|---|
| | | method: 'GET',
|
|---|
| | | success: (res) => {
|
|---|
| | | const latitude = res.data.result[0].y;
|
|---|
| | | const longitude = res.data.result[0].x;
|
|---|
| | | var point = new BMapGL.Point(longitude, latitude); // 创建点坐标
|
|---|
| | | that.map.enableScrollWheelZoom(true);
|
|---|
| | | that.map.centerAndZoom(point, 12);
|
|---|
| | |
|---|
| | | return item
|
|---|
| | | })
|
|---|
| | | })
|
|---|
| | | },
|
|---|
| | | });
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | | function error(err) {
|
|---|
| | |
|
|---|
| | | switch (err.code) {
|
|---|
| | | case err.PERMISSION_DENIED:
|
|---|
| | | console.error("用户拒绝了位置请求。");
|
|---|
| | |
|---|
| | | timeout: 5000, // 5 秒超时
|
|---|
| | | maximumAge: 0 // 不使用缓存
|
|---|
| | | };
|
|---|
| | |
|
|---|
| | | this.map.addEventListener('click', (e) => {
|
|---|
| | | this.clearMarkers()
|
|---|
| | | var mercator = this.map.lnglatToMercator(e.latlng.lng, e.latlng.lat);
|
|---|
| | |
|---|
| | | var myGeo = new BMapGL.Geocoder();
|
|---|
| | | // 根据坐标得到地址描述
|
|---|
| | | myGeo.getLocation(new BMapGL.Point(e.latlng.lng, e.latlng.lat), (result) => {
|
|---|
| | | console.log(result,'result');
|
|---|
| | | this.city = result.addressComponents.city
|
|---|
| | | if( result.surroundingPois.length>0){
|
|---|
| | | this.locationList = result.surroundingPois.map((item, index) => {
|
|---|
| | | item.id = index + 1
|
|---|
| | |
|---|
| | | this.locationList =[{
|
|---|
| | | id:1,
|
|---|
| | | title:result.address,
|
|---|
| | | point:{lat:e.latlng.lat,lng:e.latlng.lng}
|
|---|
| | | point: {
|
|---|
| | | lat: e.latlng.lat,
|
|---|
| | | lng: e.latlng.lng
|
|---|
| | | }
|
|---|
| | | }]
|
|---|
| | | }
|
|---|
| | |
|
|---|
| | |
|---|
| | | this.map.addOverlay(marker);
|
|---|
| | | this.markers.push(marker);
|
|---|
| | | });
|
|---|
| | | // },
|
|---|
| | | // error:err=>{
|
|---|
| | | // |
|---|
| | | // }
|
|---|
| | | // });
|
|---|
| | |
|
|---|
| | | }
|
|---|
| | | }
|
|---|
