微信小程序ibeacon三点定位详解


Posted in Javascript onOctober 31, 2018

空余时间简单写了一个微信小程序ibeacon三点定位。

事先淘宝买了七八个ibeacon小设备,放置在办公司角落。分别设置三个ibeacon的位置坐标点,根据每一个ibeacon到已经开启蓝牙的目标物距离,计算出目标物在当前区域内坐标位置。适用于区域内购物指示。当然,进入该区域事先要打开手机蓝牙。

下面代码:

var app = getApp() 
Page({
 data: {
  motto: 'Hello World',
  openBLE:'打开蓝牙设备',
  startBLEDiscovery:'初始化蓝牙设备',
  startBLEDevices:'目标定位',
  reStartSearchBLE:'重置蓝牙',
  startSearchBLE:'默认空',
  userInfo: {},
  deviceId: '',
  searchFlag:true,
  deviceRSSI:'',
  deviceName:'',
  deviceId:[],
  advertisServiceUUIDs: [],
  advertisData:[],
  canvasPointX:'',
  canvasPointY:'',
  avatarUrl:'../index/bg-image.jpg',
  showPosition:'' 
 },
 //事件处理函数
 bindViewTap: function() {
  wx.navigateTo({
   url: '../logs/logs'
  })
 },
 onLoad: function () { 
  var that = this
  //调用应用实例的方法获取全局数据 
  //that.setData({ deviceId: opt.deviceId }) 
  app.getUserInfo(function(userInfo){
   //更新数据 
   that.setData({
    userInfo:userInfo
   })
   //判断兼容性
   if (wx.openBluetoothAdapter) { 
   //打开蓝牙适配器,如果没有打开 showtoast
   wx.openBluetoothAdapter({
    success: function(res){
     // success
     //获取本机的蓝牙适配器状态
     wx.getBluetoothAdapterState({
      success: function(res){
       // success
       that.setData({
        searchFlag:true
       }) 
      },
      fail: function(res) {
       // fail 
       that.setData({
        searchFlag:false
       })
      },
      complete: function(res) {
       // complete
      }
     })
    },
    fail: function(res) {
     // fail 本机是否已经打开蓝牙设备
      wx.showToast({title:'请打开本机蓝牙设备,重新扫码', duration:10000 })
    },
    complete: function(res) {
     // complete
    }
   })
   } else {
     // 如果希望用户在最新版本的客户端上体验您的小程序,可以这样子提示
     wx.showModal({
      title: '提示',
      content: '当前微信版本过低,无法使用该功能,请升级到最新微信版本后重试。'
     })
    } 
    
  })
  }, 
 
  startBLEDevices: function(){
    var that = this 
     wx.startBluetoothDevicesDiscovery({
      services: [],
      success: function(res){ 
       //获取本机蓝牙设备状态  
         // success 
       that.setData({
        showPosition:setInterval(that.devicesFunc,1000)
       })  
      },
      fail: function(res) {
      // fail 
     },
     complete: function(res) {
      // complete 
     }
    })
  },
 // startBLEDevices: function(){
 //  var that = this
 //  that.setData({
 //   showPosition:setInterval(that.devicesFunc,1000)
 //  }) 
 // },
  devicesFunc: function(){
    var that = this 
    
    wx.getBluetoothDevices({
     success: function(res){
      // console.log(res); 
      var arrayRSSI = new Array();
      var arraydeviceName = new Array();
      var arraydeviceId = new Array();
      // var arrayUUIDs = new Array();
      var arrayadvertisData = new Array(); 
      var pointADistance = '';
      var pointBDistance = '';
      var pointCDistance = ''; 
      for(var i = 0; i<res.devices.length;i++){ 
        //console.log(res.devices[i].name); 
       if(res.devices[i].name.indexOf('craft')==0){ 
        //console.log(res.devices[i]);
        arrayRSSI.push(res.devices[i].RSSI);
        arraydeviceName.push(res.devices[i].name); 
        arraydeviceId[i]= res.devices[i].deviceId;
        arrayUUIDs[i]= res.devices[i].advertisServiceUUIDs[i];
        arrayadvertisData[i]= res.devices[i].advertisData  ;
        调用计算rssi对应距离的函数
        var iRssi = Math.abs(arrayRSSI[i]); 
        var power = (iRssi-59)/(10*2.0); 
        var mm = Math.pow(10, power); 
        console.log(arraydeviceName[i]+"距离的位置是"+mm+"米");  
        取01,02,03分别为,(2,0),(2,2),(0,2)固定坐标点,做定位
        
        if(res.devices[i].name.indexOf('craft01')==0){
         
        var pointARSSi = res.devices[i].RSSI ;
        var iRssi = Math.abs(pointARSSi); 
        var power = (iRssi-55)/(10*2.0); 
        var pointADistance = Math.pow(10, power); 
        console.log("a"+pointADistance); 
        console.log(pointARSSi); 
       
        }
        if(res.devices[i].name.indexOf('craft02')==0){
         
        var pointBRSSi = res.devices[i].RSSI;
        var iRssi = Math.abs(pointBRSSi); 
        var power = (iRssi-55)/(10*2.0); 
        var pointBDistance = Math.pow(10, power); 
        console.log("b"+pointBDistance);
        console.log(pointBRSSi); 
        
        }
        if(res.devices[i].name.indexOf('craft03')==0){
        
        var pointCRSSi = res.devices[i].RSSI;
        var iRssi = Math.abs(pointCRSSi); 
        var power = (iRssi-57)/(10*2.0);  
        var pointCDistance = Math.pow(10, power); 
        console.log("c"+pointCDistance); 
        console.log(pointCRSSi); 
        } 
       } 
      } 
      // 从 arrayRSSI 取三个距离定位点最近的ibeacon参与定位
      if(arrayRSSI.length > 3){
        //根据arrayRSSI进行信号强弱排序.距离越远rssi值越小
        for(var i = 0 ; i < arrayRSSI.length ; i ++){
         for(var j = i+1 ; j< arrayRSSI.length ; j++){
          if(arrayRSSI[i]<arrayRSSI[j]){
           var select = arrayRSSI[i];
           arrayRSSI[i] = arrayRSSI[j];
           arrayRSSI[j] = select;
          }
         } 
        }
        //获取最近的三个距离
        for(var i = 0 ; i < 3; i++){
          if(i==0){ 
           var pointARSSi = res.devices[i].RSSI ;
           var iRssi = Math.abs(pointARSSi); 
           var power = (iRssi-55)/(10*2.0); 
           var pointADistance = Math.pow(10, power); 
           console.log("a"+pointADistance); 
           console.log(pointARSSi); 
          }
          if(i==1){
           
           var pointBRSSi = res.devices[i].RSSI;
           var iRssi = Math.abs(pointBRSSi); 
           var power = (iRssi-55)/(10*2.0); 
           var pointBDistance = Math.pow(10, power); 
           console.log("b"+pointBDistance);
           console.log(pointBRSSi); 
          }
          if(i==2){ 
           var pointCRSSi = res.devices[i].RSSI;
           var iRssi = Math.abs(pointCRSSi); 
           var power = (iRssi-57)/(10*2.0);  
           var pointCDistance = Math.pow(10, power); 
           console.log("c"+pointCDistance); 
           console.log(pointCRSSi); 
          }  
        } 
      } 
        //获取定位点的x和y
        if(!pointADistance==''&&!pointBDistance==''&&!pointCDistance==''){
        var pointDX='';var pointDY = '';
        var p = Math.pow(pointADistance,2)/10-Math.pow(pointBDistance,2)/10;
        pointDX = 2.5 - p; 
 
        var m = Math.pow(pointADistance,2)/10-Math.pow(pointCDistance,2)/10;
        pointDY = 2.5 - m; 
 
        console.log('目标所在位置X是'+pointDX);
        console.log('目标所在位置Y是'+pointDY);
         if(pointDX > 0 && pointDY > 0){ 
         wx.showToast({title:'欢迎进入25楼craft', duration:4000 }); 
         }
        that.setData({
          canvasPointX:pointDX,
          canvasPointY:pointDY
         })
        
        //创建画布 
        //计算坐标点在规定canvas上的位置显示
        var context = wx.createCanvasContext(); 
        context.setStrokeStyle("#00ff00");
        //a,b,c,d,e,f  a,b起始坐标,c半径,d,e起始和终止角度 
        context.arc(that.data.canvasPointX*30,that.data.canvasPointY*30,5,0,2*Math.PI);
        context.fill();
        wx.drawCanvas({
         canvasId: 'firstCanvas',
         actions: context.getActions() // 获取绘图动作数组
        }) 
 
        wx.showModal({title:'X轴:'+pointDX+'Y轴:'+pointDY, duration:5000 }); 
         //开始网络请求
         wx.request({
          url: 'http://craftww.cn/weixinIbeacon/index.php',
          data: {},
          method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
          // header: {}, // 设置请求的 header
          success: function(res){
           // success
          },
          fail: function(res) {
           // fail
          },
          complete: function(res) {
           // complete
          }
         })
 
        }else{
        wx.showToast({title:'正在搜索...', duration:1000 })
         开始网络请求
         wx.request({
          url: 'http://craftww.cn/weixinIbeacon/index.php',
          data: {},
          method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
          // header: {}, // 设置请求的 header
          success: function(res){
           // success
          },
          fail: function(res) {
           // fail
          },
          complete: function(res) {
           // complete
          }
         })
        } 
 
     },
     fail: function(res) {
      // fail
     },
     complete: function(res) {
      // complete
     }
    }) 
  } ,
  //动态显示
  createList: function(thisName){
   var that = this 
     that.setData({
      array:[{deviceDistance:"1"},{deviceDistance:"1"},{deviceDistance:"1"},{deviceDistance:"1"},{deviceDistance:"1"}]
     }) 
  },
  reStartSearchBLE: function(){ 
   var that = this
  //清除本地数据缓存
  wx.stopBluetoothDevicesDiscovery({
   success: function(res){
    // success
   },
   fail: function(res) {
    // fail
   },
   complete: function(res) {
    // complete
   }
  })
   wx.clearStorageSync();
   clearInterval(that.data.showPosition); 
   console.log(that.data.showPosition);
  // that.context.clearRect(0,0,canvas.width,canvas.height);
   //断开蓝牙
   var that = this
   wx.closeBluetoothAdapter({
    success: function(res){
     // success
     console.log('重置成功');
     //打开蓝牙适配器,如果没有打开 showtoast
   wx.openBluetoothAdapter({
    success: function(res){
     // success
     //获取本机的蓝牙适配器状态
     wx.getBluetoothAdapterState({
      success: function(res){
       // success 
     
      },
      fail: function(res) {
       // fail 
      },
      complete: function(res) {
       // complete
      }
     })
    },
    fail: function(res) {
        },
    complete: function(res) {
     // complete
    }
   })
    },
    fail: function(res) {
     // fail
    },
    complete: function(res) {
     // complete
    }
   })
  }
  //zheli
})

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript 学习笔记(十六) js事件
Feb 01 Javascript
JQuery实现鼠标滚轮滑动到页面节点
Jul 28 Javascript
js实现无限级树形导航列表效果代码
Sep 23 Javascript
jQuery获取访问者IP地址的方法(基于新浪API与QQ查询接口)
May 25 Javascript
Bootstrap基本组件学习笔记之进度条(15)
Dec 08 Javascript
javascript基本数据类型和转换
Mar 17 Javascript
JS实现的文字间歇循环滚动效果完整示例
Feb 13 Javascript
JavaScript中的一些实用小技巧总结
Apr 07 Javascript
js get和post请求实现代码解析
Feb 06 Javascript
JavaScript检测是否开启了控制台(F12调试工具)
Oct 02 Javascript
vue 使用 sortable 实现 el-table 拖拽排序功能
Dec 26 Vue.js
JS精髓原型链继承及构造函数继承问题纠正
Jun 16 Javascript
小程序获取周围IBeacon设备的方法
Oct 31 #Javascript
详解js删除数组中的指定元素
Oct 31 #Javascript
Vue中使用方法、计算属性或观察者的方法实例详解
Oct 31 #Javascript
Vue项目History模式404问题解决方法
Oct 31 #Javascript
Vue.js中对css的操作(修改)具体方式详解
Oct 30 #Javascript
vue组件中的样式属性scoped实例详解
Oct 30 #Javascript
node上的redis调用优化示例详解
Oct 30 #Javascript
You might like
使用无限生命期Session的方法
2006/10/09 PHP
使用PHP会话(Session)实现用户登陆功能
2013/06/29 PHP
php+ajax制作无刷新留言板
2015/10/27 PHP
Laravel 实现Controller向blade前台模板赋值的四种方式小结
2019/10/22 PHP
imagettftext() 失效,不起作用
2021/03/09 PHP
javascript 兼容FF的onmouseenter和onmouseleave的代码
2008/07/19 Javascript
jquery拖动插件(jquery.drag)使用介绍
2013/06/18 Javascript
Node.js的包详细介绍
2015/01/14 Javascript
JQuery radio(单选按钮)操作方法汇总
2015/04/15 Javascript
基于jQuery实现放大镜特效
2020/10/19 Javascript
JS获取子窗口中返回的数据实现方法
2016/05/28 Javascript
微信小程序 WXML、WXSS 和JS介绍及详解
2016/10/08 Javascript
jQuery滑动效果实现方法分析
2018/09/05 jQuery
详解vue项目接入微信JSSDK的坑
2018/12/14 Javascript
简单学习5种处理Vue.js异常的方法
2019/06/17 Javascript
详解从vue-loader源码分析CSS Scoped的实现
2019/09/23 Javascript
浅谈vue中document.getElementById()拿到的是原值的问题
2020/07/26 Javascript
通过python下载FTP上的文件夹的实现代码
2013/02/10 Python
python采集博客中上传的QQ截图文件
2014/07/18 Python
Python中的__new__与__init__魔术方法理解笔记
2014/11/08 Python
Django admin美化插件suit使用示例
2017/12/12 Python
详解django三种文件下载方式
2018/04/06 Python
Django Rest framework之权限的实现示例
2018/12/17 Python
Python字符串的一些操作方法总结
2019/06/10 Python
关于Python 的简单栅格图像边界提取方法
2019/07/05 Python
css3动画鼠标放上图片逐渐变大鼠标离开图片逐渐缩小效果
2021/01/27 HTML / CSS
美国购买肉、鸭、家禽、鹅肝和熟食网站:D’Artagnan
2018/11/13 全球购物
Bandier官网:奢侈、时尚前卫的健身服装首选目的地
2020/07/05 全球购物
建筑个人求职信范文
2014/01/25 职场文书
2014年大学生预备党员思想汇报1000字
2014/09/13 职场文书
机关党员三严三实心得体会
2014/10/13 职场文书
2015年财务经理工作总结
2015/05/13 职场文书
债务纠纷代理词
2015/05/25 职场文书
党员转正党支部意见
2015/06/02 职场文书
2015年社区党建工作汇报材料
2015/06/25 职场文书
《花钟》教学反思
2016/02/17 职场文书