https://www.bilibili.com/video/BV1cJ411879s
但是因为这个调用的接口要money,太贵了就没买,就只是做了一些不用接口的东西
最终的效果图:
一、
①调用的接口视频中主要是用到了咕咕数据中的【地理坐标逆编码】接口,https://www.gugudata.com/api/details/geodecode
这个接口是可以获取到,用户的位置,
②得到了地理信息位置之后,需要知道这个地理位置的天气预报信息,通过调用下面的接口
https://www.gugudata.com/api/details/weatherinfo
这个获取到的东西,很全面,包括了在紫外线强度,和提醒你今天要穿什么衣服,带伞啊这种贴心的话,很强大的接口
③视频中用的都是付费的接口,我也找到了一些免费的接口,参考博文https://www.cnblogs.com/demodashi/p/8481610.html
通过注册“和风天气预报的免费版接口,还有百度地图开放平台的天气预报接口,两个都是免费的,当然功能也配额肯定也是和付费的有一定区别
二、具体实现流程:
①拿到设计图(UI设计图)---可以在https://dribbble.com/search/weather%20forecast 中查看相关设计师大佬的作品,找找灵感
②在微信开发者工具里面创立项目,然后把默认的文件进行清理,只留在我们需要的东西
把目标变成大概这个样子,只留下首页和page的相关样式,其他都可以删掉的
③修改小程序的题目:在app.json文件中找到"navigationBarTitleText"这个属性进行修改。
④获取用户的经纬度(之后把这个经纬度数据用于发送给接口,得到相应的东西)
这种微信本身提供给我们的接口的话,可以直接在微信开发者文档里面查看的
找到wx.getLocation(Object object) ===获取当前的地理位置、速度。当用户离开小程序后,此接口无法调用
可以直接复制微信提供的示例代码:
wx.getLocation({ type: 'wgs84', success (res) { const latitude = res.latitude const longitude = res.longitude const speed = res.speed const accuracy = res.accuracy } })