Hbuilder獲取手機當前地理位置的天氣

         前言：前面一段時間，公司項目里有一個需求 是獲取當前手機地理位置當天的天氣情況  將實時天氣信息提供給客戶。在網上搜索資料時候，發現知識很零碎，自己實現以后整理出來，方便於各位的學習與使用。

一、獲取當前手機地理位置。

           Html5提供接口plus.geolocation.getCurrentPosition(function(position) {

           }, function(error) {});

           可以用console.log(JSON.stringify(position));查看一下返回的內容，從中提取自己實際項目中需要地理信息。

           在獲取天氣時候 為了優化用戶體驗。是需要做指引性質的操作的。例如 ：百度地圖的提示，是否開啟手機精准定位等等。即需要檢測當前用戶是否已經開啟了定位，如果沒有，指引用戶完成手機定位開啟。如果已經開啟手機定位則跳過。

           

                        var that = this;
                        if(plus.os.name == "Android") {
                            var context = plus.android.importClass("android.content.Context");
                            var locationManager = plus.android.importClass("android.location.LocationManager");
                            var mainplus = plus.android.runtimeMainActivity();
                            var mainSvr = mainplus.getSystemService(context.LOCATION_SERVICE);
                            var androidIsOpen = mainSvr.isProviderEnabled(locationManager.GPS_PROVIDER);
                            if(!androidIsOpen) {
                                mui.confirm('開啟位置服務,獲取精准定位', ' ', ['去開啟', '取消'], function(result) {
                                    if(result.index == 0) {
                                        var Intent = plus.android.importClass('android.content.Intent');
                                        var Settings = plus.android.importClass('android.provider.Settings');
                                        var intent = new Intent(Settings.ACTION_LOCATION_SOURCE_SETTINGS); //可設置表中所有Action字段
                                        mainplus.startActivity(intent);
                                    }
                                }, 'div')
                            }
                            that.IsOpenGps = androidIsOpen;
                        } else {
                            var CLLocationManager = plus.ios.import("CLLocationManager");
                            var authorizationStatus = CLLocationManager.authorizationStatus();
                            switch(authorizationStatus) {
                                case 0:
                                    mui.toast("未被授權位置信息,無法展示天氣");
                                    /// User has not yet made a choice with regards to this application未作出位置信息權限選擇
                                    break;
                                case 1:
                                    mui.toast("未被授權位置信息,無法展示天氣");
                                    // This application is not authorized to use location services.  Due
                                    // to active restrictions on location services, the user cannot change
                                    // this status, and may not have personally denied authorization未被授權位置信息
                                    break;
                                case 2:
                                    mui.toast("未被授權位置信息,無法展示天氣");
                                    // User has explicitly denied authorization for this application, or
                                    // location services are disabled in Settings.明確拒絕授權位置信息
                                    break;
                                case 3:
                                    //mui.toast("已經獲取位置信息");
                                    // User has granted authorization to use their location at any time,
                                    // including monitoring for regions, visits, or significant location changes.
                                    break;
                                case 4:
                                    //mui.toast("已經獲取位置信息");
                                    // User has granted authorization to use their location only when your app
                                    // is visible to them (it will be made visible to them if you continue to
                                    // receive location updates while in the background).  Authorization to use
                                    // launch APIs has not been granted.
                                    break;
                                case 5:
                                    mui.toast("未被授權位置信息,無法展示天氣");
                                    // This value is deprecated, but was equivalent to the new -Always value.值被棄用
                                    break;
                                    defalut:
                                        break;
                            }
                            var isIosOpen = false;
                            if(authorizationStatus == 3 || authorizationStatus == 4) {
                                isIosOpen = true;
                            }
                            that.IsOpenGps = isIosOpen;

             

二、根據獲取的地理信息獲取當天的天氣情況。

           這里采用了百度天氣的接口。

          1.首先需要百度地圖的API Key   申請地址：http://lbsyun.baidu.com/apiconsole/key

          2.創建應用    選擇微信小程序的應用類型。

         

          3.獲取天氣JSON

var baidukey = "voUKGmLO***********Ia1qQc";//申請的AK

//LatandLong  經緯度
    function GetTodayWeather(city, LatandLong,callback) {
        var jsonUrl = "http://api.map.baidu.com/telematics/v3/weather?location=" + LatandLong + "&output=json&ak=" + baidukey + "";
        mui.ajax(jsonUrl, {
            dataType: 'json',
            type: 'get',
            //timeout: 10000,
            success: function(data) {
                if(data.status == "success") {
                    callback(data.results[0])
                }
            },
            error: function(xhr, type, error) {
                //console.log(type)
                mui.toast("網絡異常,請稍候再試");
            }
        });
    }

          4.天氣JSON

{
    error: 0,
    status: "success",
    date: "2013-07-17",
    results: [
        {
            currentCity: "北京市",
            weather_data: [
                {
                    date: "今天（周三）",
                    dayPictureUrl: "http://api.map.baidu.com/images/weather/day/duoyun.png",
                    nightPictureUrl: "http://api.map.baidu.com/images/weather/night/duoyun.png",
                    weather: "多雲",
                    wind: "微風",
                    temperature: "23℃"
                },
                {
                    date: "明天（周四）",
                    dayPictureUrl: "http://api.map.baidu.com/images/weather/day/leizhenyu.png",
                    nightPictureUrl: "http://api.map.baidu.com/images/weather/night/zhongyu.png",
                    weather: "雷陣雨轉中雨",
                    wind: "微風",
                    temperature: "29～22℃"
                },
                {
                    date: "后天（周五）",
                    dayPictureUrl: "http://api.map.baidu.com/images/weather/day/yin.png",
                    nightPictureUrl: "http://api.map.baidu.com/images/weather/night/duoyun.png",
                    weather: "陰轉多雲",
                    wind: "微風",
                    temperature: "31～23℃"
                },
                {
                    date: "大后天（周六）",
                    dayPictureUrl: "http://api.map.baidu.com/images/weather/day/duoyun.png",
                    nightPictureUrl: "http://api.map.baidu.com/images/weather/night/duoyun.png",
                    weather: "多雲",
                    wind: "微風",
                    temperature: "31～24℃"
                }
            ]
        },
        {
            currentCity: "合肥市",
            weather_data: [
                {
                    date: "今天（周三）",
                    dayPictureUrl: "http://api.map.baidu.com/images/weather/day/duoyun.png",
                    nightPictureUrl: "http://api.map.baidu.com/images/weather/night/duoyun.png",
                    weather: "多雲",
                    wind: "東風3-4級",
                    temperature: "27℃"
                },
                {
                    date: "明天（周四）",
                    dayPictureUrl: "http://api.map.baidu.com/images/weather/day/duoyun.png",
                    nightPictureUrl: "http://api.map.baidu.com/images/weather/night/duoyun.png",
                    weather: "多雲",
                    wind: "東北風3-4級",
                    temperature: "35～27℃"
                },
                {
                    date: "后天（周五）",
                    dayPictureUrl: "http://api.map.baidu.com/images/weather/day/duoyun.png",
                    nightPictureUrl: "http://api.map.baidu.com/images/weather/night/duoyun.png",
                    weather: "多雲",
                    wind: "南風",
                    temperature: "35～27℃"
                },
                {
                    date: "大后天（周六）",
                    dayPictureUrl: "http://api.map.baidu.com/images/weather/day/duoyun.png",
                    nightPictureUrl: "http://api.map.baidu.com/images/weather/night/duoyun.png",
                    weather: "多雲",
                    wind: "東風",
                    temperature: "34～27℃"
                }
            ]
        }
    ]
}

          5.在回調函數里面解析自己需要的數據即可。

         結語：希望對正在用Hbuilder 開發APP的你 有所幫助。