js根据经纬度取随机附近经纬度

实现功能:

小程序根据当前经纬度得出随机的附近经纬度显示在地图上做标记点,效果图

实现代码

// map.js
var app = getApp()
var mymap = '';
var lat = '';
var long = '';
var that;

function latlog(lat, lon, d = 1,d2=3) {
  var angle = Math.random(1, 360);
  var nd=Math.random(d,d2);
  var suiji=parseInt(Math.random()*(45-(-45)+1)+(-45));
  
  lon = lon + (nd * Math.cos(angle * Math.PI / 180)) / (suiji * Math.cos(lat * Math.PI / 180));
  lat = lat + (nd * Math.cos(angle * Math.PI / 180)) / suiji;
  return {lat,lon};
}

Page({
  //引入数据库
  onLoad: function (option) {
    that = this
    wx.getLocation({
      type: 'wgs84',
      success(mres) {
        var map_lat = mres.latitude;
        var map_long = mres.longitude;
        var map_speed = mres.speed;
        var map_accuracy = mres.accuracy;
        for(let i=1;i<10;i++){
          that.setMapItemMarkers(latlog(map_lat, map_long).lon,latlog(map_lat, map_long).lat,i)
        }
        that.setData({
          lat: map_lat,
          long: map_long
        });
      }
    });
  },
  setMapItemMarkers(longitude, latitude,idx) {
    // console.log('llllllll2l',longitude, latitude)
    if(idx==0)return
    var that = this;
    let iconPath;
    // direction 旋转角度
    var obj_item = {
      iconPath: "/img/cdz.png",
      // iconPath: "../../../images/car" + carOilBunker + ".png",
      id: idx,
      longitude: longitude,
      latitude: latitude,
      customCallout: {
        anchorX:45,
        anchorY:45,
        display: "ALWAYS",
      },
      width: 15,
      height: 25
    };
 
    var circles_aa = {
      latitude: latitude,
      longitude: longitude,
      color: '#FF0000DD',
      fillColor: '#7cb5ec88',
      radius: 160,
      strokeWidth: 1
    }
    var circles = this.data.circles || [];
 
    circles.push(circles_aa);
 
    var markers = this.data.markers || [];
    markers.push(obj_item);
    this.setData({
      markers
      //  circles
    })
  },
  data: {
    markers:[],
    controls: [{
      id: 1,
      iconPath: '/img/cdz.png',
      position: {
        left: 0,
        top: 300 - 1,
        width: 50,
        height: 50
      },
      clickable: true
    }]
  },
  //显示对话框
  showModal: function (event) {
    //console.log(event.markerId);
    var i = event.markerId;
    var url = app.url + 'Api/Api/get_shop_dp_detail&PHPSESSID=' + wx.getStorageSync('PHPSESSID');
    var that = this;
    console.log('====get_detail====')
    wx.request({
      url: url,
      data: {
        id: i,
        openid: wx.getStorageSync('openid')
      },
      success: function (res) {
        console.log(res);
        that.setData({
          myall: res.data.data
        });
      }
    });

    // 显示遮罩层
    var animation = wx.createAnimation({
      duration: 200,
      timingFunction: "linear",
      delay: 0
    })
    this.animation = animation
    animation.translateY(300).step()
    this.setData({
      animationData: animation.export(),
      showModalStatus: true
    })
    setTimeout(function () {
      animation.translateY(0).step()
      this.setData({
        animationData: animation.export()
      })
    }.bind(this), 200)
  },
  //隐藏对话框
  hideModal: function () {
    // 隐藏遮罩层
    var animation = wx.createAnimation({
      duration: 200,
      timingFunction: "linear",
      delay: 0
    })
    this.animation = animation
    animation.translateY(300).step()
    this.setData({
      animationData: animation.export(),
    })
    setTimeout(function () {
      animation.translateY(0).step()
      this.setData({
        animationData: animation.export(),
        showModalStatus: false
      })
    }.bind(this), 200)
  },

  opendetail: function (event) {
    console.log('-----跳转商品-----');
    //console.log(event);
    var id = event.currentTarget.dataset.id;
    this.setData({
      id: id
    });
    wx.navigateTo({
        url: "/pages/detail/detail?id=" + id
      }),
      console.log(id);
  },

  calling: function (event) {
    var tel = event.currentTarget.dataset.id.tel;
    this.setData({
      tel: tel
    });
    wx.makePhoneCall({
      phoneNumber: tel,
      success: function () {
        console.log("拨打电话成功!")
      },
      fail: function () {
        console.log("拨打电话失败!")
      }
    })
  }
})

 

相关推荐
©️2020 CSDN 皮肤主题: 成长之路 设计师:Amelia_0503 返回首页
实付 49.90元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值