小程序 获取当前位置和天气

迷南。 2022-05-21 07:51 384阅读 0赞

" class="reference-link">70

bmap-wx.min.js

//直接复制就好

  1. "use strict";function _classCallCheck(t,a){if(!(t instanceof a))throw new TypeError("Cannot call a class as a function")}var _createClass=function(){function t(t,a){for(var e=0;e<a.length;e++){var i=a[e];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(t,i.key,i)}}return function(a,e,i){return e&&t(a.prototype,e),i&&t(a,i),a}}(),BMapWX=function(){function t(a){_classCallCheck(this,t),this.ak=a.ak}return _createClass(t,[{key:"getWXLocation",value:function(t,a,e,i){t=t||"gcj02",a=a||function(){},e=e||function(){},i=i||function(){},wx.getLocation({type:t,success:a,fail:e,complete:i})}},{key:"search",value:function(t){var a=this;t=t||{};var e={query:t.query||"生活服务$美食&酒店",scope:t.scope||1,filter:t.filter||"",coord_type:t.coord_type||2,page_size:t.page_size||10,page_num:t.page_num||0,output:t.output||"json",ak:a.ak,sn:t.sn||"",timestamp:t.timestamp||"",radius:t.radius||2e3,ret_coordtype:"gcj02ll"},i={iconPath:t.iconPath,iconTapPath:t.iconTapPath,width:t.width,height:t.height,alpha:t.alpha||1,success:t.success||function(){},fail:t.fail||function(){}},n="gcj02",o=function(t){e.location=t.latitude+","+t.longitude,wx.request({url:"https://api.map.baidu.com/place/v2/search",data:e,header:{"content-type":"application/json"},method:"GET",success:function(t){var a=t.data;if(0===a.status){var e=a.results,n={};n.originalData=a,n.wxMarkerData=[];for(var o=0;o<e.length;o++)n.wxMarkerData[o]={id:o,latitude:e[o].location.lat,longitude:e[o].location.lng,title:e[o].name,iconPath:i.iconPath,iconTapPath:i.iconTapPath,address:e[o].address,telephone:e[o].telephone,alpha:i.alpha,width:i.width,height:i.height};i.success(n)}else i.fail({errMsg:a.message,statusCode:a.status})},fail:function(t){i.fail(t)}})},s=function(t){i.fail(t)},c=function(){};if(t.location){var u=t.location.split(",")[1],r=t.location.split(",")[0],l="input location",p={errMsg:l,latitude:r,longitude:u};o(p)}else a.getWXLocation(n,o,s,c)}},{key:"suggestion",value:function(t){var a=this;t=t||{};var e={query:t.query||"",region:t.region||"全国",city_limit:t.city_limit||!1,output:t.output||"json",ak:a.ak,sn:t.sn||"",timestamp:t.timestamp||"",ret_coordtype:"gcj02ll"},i={success:t.success||function(){},fail:t.fail||function(){}};wx.request({url:"https://api.map.baidu.com/place/v2/suggestion",data:e,header:{"content-type":"application/json"},method:"GET",success:function(t){var a=t.data;0===a.status?i.success(a):i.fail({errMsg:a.message,statusCode:a.status})},fail:function(t){i.fail(t)}})}},{key:"regeocoding",value:function(t){var a=this;t=t||{};var e={coordtype:t.coordtype||"gcj02ll",pois:t.pois||0,output:t.output||"json",ak:a.ak,sn:t.sn||"",timestamp:t.timestamp||"",ret_coordtype:"gcj02ll"},i={iconPath:t.iconPath,iconTapPath:t.iconTapPath,width:t.width,height:t.height,alpha:t.alpha||1,success:t.success||function(){},fail:t.fail||function(){}},n="gcj02",o=function(t){e.location=t.latitude+","+t.longitude,wx.request({url:"https://api.map.baidu.com/geocoder/v2/",data:e,header:{"content-type":"application/json"},method:"GET",success:function(a){var e=a.data;if(0===e.status){var n=e.result,o={};o.originalData=e,o.wxMarkerData=[],o.wxMarkerData[0]={id:0,latitude:t.latitude,longitude:t.longitude,address:n.formatted_address,iconPath:i.iconPath,iconTapPath:i.iconTapPath,desc:n.sematic_description,business:n.business,alpha:i.alpha,width:i.width,height:i.height},i.success(o)}else i.fail({errMsg:e.message,statusCode:e.status})},fail:function(t){i.fail(t)}})},s=function(t){i.fail(t)},c=function(){};if(t.location){var u=t.location.split(",")[1],r=t.location.split(",")[0],l="input location",p={errMsg:l,latitude:r,longitude:u};o(p)}else a.getWXLocation(n,o,s,c)}},{key:"weather",value:function(t){var a=this;t=t||{};var e={coord_type:t.coord_type||"gcj02",output:t.output||"json",ak:a.ak,sn:t.sn||"",timestamp:t.timestamp||""},i={success:t.success||function(){},fail:t.fail||function(){}},n="gcj02",o=function(t){e.location=t.longitude+","+t.latitude,wx.request({url:"https://api.map.baidu.com/telematics/v3/weather",data:e,header:{"content-type":"application/json"},method:"GET",success:function(t){var a=t.data;if(0===a.error&&"success"===a.status){var e=a.results,n={};n.originalData=a,n.currentWeather=[],n.currentWeather[0]={currentCity:e[0].currentCity,pm25:e[0].pm25,date:e[0].weather_data[0].date,temperature:e[0].weather_data[0].temperature,weatherDesc:e[0].weather_data[0].weather,wind:e[0].weather_data[0].wind},i.success(n)}else i.fail({errMsg:a.message,statusCode:a.status})},fail:function(t){i.fail(t)}})},s=function(t){i.fail(t)},c=function(){};if(t.location){var u=t.location.split(",")[0],r=t.location.split(",")[1],l="input location",p={errMsg:l,latitude:r,longitude:u};o(p)}else a.getWXLocation(n,o,s,c)}}]),t}();module.exports.BMapWX=BMapWX;

.js

  1. // 引用百度地图微信小程序JSAPI模块
  2. var bmap = require('../../pages/weizhidingwei/bmap-wx.min.js');
  3. var wxMarkerData = []; //定位成功回调对象
  4. Page({
  5. data: {
  6. weatherData: '',
  7. ak: "您的ak", //填写申请到的ak
  8. markers: [],
  9. longitude: '', //经度
  10. latitude: '', //纬度
  11. address: '', //地址
  12. cityInfo: {} //城市信息
  13. },
  14. onLoad: function () {
  15. var that = this;
  16. /* 获取定位地理位置 */
  17. // 新建bmap对象
  18. var BMap = new bmap.BMapWX({
  19. ak: that.data.ak
  20. });
  21. var fail = function(data) {
  22. console.log('fail!!!!')
  23. };
  24. var success = function (data) {
  25. //返回数据内,已经包含经纬度
  26. console.log(data);
  27. //使用wxMarkerData获取数据
  28. wxMarkerData = data.wxMarkerData;
  29. //把所有数据放在初始化data内
  30. that.setData({
  31. markers: wxMarkerData,
  32. latitude: wxMarkerData[0].latitude,
  33. longitude: wxMarkerData[0].longitude,
  34. address: wxMarkerData[0].address,
  35. cityInfo: data.originalData.result.addressComponent,
  36. });
  37. }
  38. // 发起regeocoding检索请求
  39. BMap.regeocoding({
  40. fail: fail,
  41. success: success
  42. });
  43. },
  44. //显示天气
  45. onShow:function()
  46. {
  47. var that = this;
  48. var BMap = new bmap.BMapWX({
  49. ak: '您的ak' //填写申请到的ak
  50. });
  51. var fail = function (data) {
  52. console.log('fail!!!!')
  53. };
  54. var success = function (data) {
  55. console.log('success!!!');
  56. var weatherData = data.currentWeather[0];
  57. weatherData = '城市:' + weatherData.currentCity + '\n' + 'PM2.5:' + weatherData.pm25 + '\n' + '日期:' + weatherData.date + '\n' + '温度:' + weatherData.temperature + '\n' + '天气:' + weatherData.weatherDesc + '\n' + '风力:' + weatherData.wind + '\n';
  58. that.setData({
  59. weatherData: weatherData
  60. });
  61. }
  62. BMap.weather({
  63. fail: fail,
  64. success: success
  65. });
  66. }
  67. })

wxml

  1. <view>
  2. <map id="map" longitude='{
  3. {longitude}}' latitude='{
  4. {latitude}}'bindregionchange="regionchange" show-location style="width: 100%; height: 300px;"></map>
  5. <view>经度:{
  6. {longitude}}</view>
  7. <view>纬度:{
  8. {latitude}}</view>
  9. <view>地址:{
  10. {address}}</view>
  11. <view>城市:{
  12. {cityInfo.city}}</view>
  13. <view>{
  14. {weatherData}}</view>
  15. </view>

发表评论

表情:
评论列表 (有 0 条评论,384人围观)

还没有评论,来说两句吧...

相关阅读

    相关 程序获取当前日期

    需求:获取系统当前年月日和时分秒,并且显示在界面。如下图所示: ![318][]   其实方法很简单,小程序API里面也有一定的介绍。 1:准备好要获取时间的.js文件