小程序獲取 定位 天氣 (百度地圖)

小程序調用百度地圖API

建立百度應用

百度地圖開放平臺控制檯中建立應用
![image.png](/img/bVbBVkP)
記得要綁定真實的APPID,會由今生成訪問應用的AK

如何使用

設置小程序請求合法域名 (服務域名)
引入百度api  SDK-wx.js  官方網站上有資源
// 引用百度地圖微信小程序JSAPI模塊  
var bmap \=  require('../../libs/bmap-wx.js');  
Page({ 
    globalData:{ 
        BMap: null,
        baiduKey: 'uKYgmr******************Hq3',//你的AK
        addressName: null, //地址
        currentWeather: { //天氣
        }, 
    }, 
    onLaunch:function(){  
        var that \=  this; // 新建百度地圖對象  
        that.globalData.BMap = new bmap.BMapWX({
            ak: that.globalData.baiduKey
        });
    },
    onShow:function(){
        var that = thisthat
        that.globalData.BMap.regeocoding({
            iconPath: '../../static/icon-logo.png',
            iconTapPath: '../../static/icon-logo.png',
            success: (data) => {
                this.globalData.addressName = data.wxMarkerData[0].address
            }
        })
        that.globalData.BMap.weather({
            success: (data) => {
                let {
                    currentWeather,
                    originalData
                } = data
                let weatherObj = {}
                //這是格式化數據能夠不參考
                let hour = new Date().getHours() //判斷白天仍是 黑天
                weatherObj.currentCity = currentWeather[0].currentCity //城市
                weatherObj.weatherDesc = currentWeather[0].weatherDesc //天氣描述
                weatherObj.date = currentWeather[0].date.split("(")[0] //時間
                weatherObj.temperature = currentWeather[0].date.split("(")[1].split(")")[0].split(":")[1].split("℃")[0] //實時溫度
                weatherObj.pictureUrl = hour > 19 && hour < 7 ? originalData.results[0].weather_data[0].nightPictureUrl :
                    originalData.results[0].weather_data[0].dayPictureUrl
                this.globalData.currentWeather = weatherObj;
                console.log(weatherObj)
            }
        })
    }
})

接下來就是頁面展現了,這裏只是簡單應用,若是有複雜需求,或者用到地圖應用,可能話會繼續深究更新。小程序

感謝點贊,轉載註明出處微信小程序

相關文章
相關標籤/搜索