最近给我的小程序增加了天气预报的功能,采用的是Baidu地图的小程序API。
百度地图微信小程序JavaScript API 为小程序而生,帮助开发者在微信小程序中快速便捷的获取百度丰富的数据资源,提供诸如POI查询、模糊查询、地址转换和天气查询功能。
该套API全面支持HTTPS请求,且免费对外开放。您需先申请密钥(ak)才可使用。
引入JS模块
在项目根目录下新建一个路径,下载百度地图微信小程序JavaScript API,解压后得到 bmap-xw.js 文件,将其拷贝到新建的路径下,安装完成。
如下图所示,新建路径 "libs" ,将 bmap-xw.js 文件拷贝至 "libs" 路径下。
天气查询
根据经纬度/城市名查询天气情况,支持实时天气、天气预报。
默认检索当前定位城市的天气信息,也可以通过参数设置查询指定位置的天气。
检索结果包含当前实时天气的重要数据和完整数据(如:穿衣、洗车指数,未来几天的天气等)两部分。方便开发者进行自定义开发。
实现方法
打开微信小程序 pages/index/index.js 文件,用下面的代码完全替换原代码。
在以下的代码中,首先引用百度地图微信小程序JavaScript API模块,然后调用BMapWX.weather方法进行天气信息的检索。
// 引用百度地图微信小程序JSAPI模块
varbmap=require('../../libs/bmap-wx.js');
Page({data:{weatherData:''},onLoad:function(){
varthat=this;
// 新建百度地图对象
varBMap=newbmap.BMapWX({ak:'您的ak'});
varfail=function(data){console.log(data)};varsuccess=function(data){varweatherData=data.currentWeather[0];
weatherData='城市:'+weatherData.currentCity+'\n'+'PM2.5:'+weatherData.pm25+'\n'+'日期:'+weatherData.date+'\n'+'温度:'+weatherData.temperature+'\n'+'天气:'+weatherData.weatherDesc+'\n'+'风力:'+weatherData.wind+'\n';that.setData({weatherData:weatherData});}
// 发起weather请求
BMap.weather({
fail:fail,
success:success});
}})