//获取当前的IP定位;
var key = "4d9a765939a2b76588a3341c2***"
var url = "https://restapi.amap.com/v3/ip?key=" + key;
$.getJSON(url, function (res) {
//console.log(res);
var adcode = res.adcode;
$("#ip").html("当前位置:" + res.province + res.city);
//显示天气情况;
getWeather(adcode, key)
})
获取天气情况函数
//天气函数;
function getWeather(adcode, key) {
/*天气查询API*/
var url = 'https://restapi.amap.com/v3/weather/weatherInfo?city=' + adcode + '&key=' + key + '&extensions=all';
$.getJSON(url, function (res) {
//console.log(res);
//当前星期;
$(".date-dayname").html(getWeek(res.forecasts[0].casts[0].week));
//当前时间;
$(".date-day").html(res.forecasts[0].reporttime.slice(0, 10));
//所在地区;
$(".location").html(res.forecasts[0].city);
//当天温度;
$(".weather-temp").html(res.forecasts[0].casts[0].daytemp + "°C");
//当天天气现象;
$(".weather-desc").html(res.forecasts[0].casts[0].dayweather);
//当天风力;
$("#daypower").html(res.forecasts[0].casts[0].daypower);
//当天风向;
$("#daywind").html(res.forecasts[0].casts[0].daywind);
//当天天气现象;
$("#dayweather").html(res.forecasts[0].casts[0].dayweather);
//四日预报,星期
$("#week0").html(getWeek(res.forecasts[0].casts[0].week));
$("#week1").html(getWeek(res.forecasts[0].casts[1].week));
$("#week2").html(getWeek(res.forecasts[0].casts[2].week));
$("#week3").html(getWeek(res.forecasts[0].casts[3].week));
//四日预报,温度
$("#temp0").html(res.forecasts[0].casts[0].daytemp + "°C");
$("#temp1").html(res.forecasts[0].casts[1].daytemp + "°C");
$("#temp2").html(res.forecasts[0].casts[2].daytemp + "°C");
$("#temp3").html(res.forecasts[0].casts[3].daytemp + "°C");
//天气图标;
$("#icon").html(getIcon(0, "day", res.forecasts[0].casts[0].dayweather));
$("#icon0").html(getIcon(1, "day", res.forecasts[0].casts[0].dayweather));
$("#icon1").html(getIcon(1, "day", res.forecasts[0].casts[1].dayweather));
$("#icon2").html(getIcon(1, "day", res.forecasts[0].casts[2].dayweather));
$("#icon3").html(getIcon(1, "day", res.forecasts[0].casts[3].dayweather));
})
}
判断星期
//判断星期;
function getWeek(week) {
switch (week) {
case "1":
return "星期一"
break;
case "2":
return "星期二"
break;
case "3":
return "星期三"
break;
case "4":
return "星期四"
break;
case "5":
return "星期五"
break;
case "6":
return "星期六"
break;
case "7":
return "星期日"
break;
default:
return "异常"
}
}
判断天气情况返回对应图图标
//按天气情况返回对应图图标;
/* local图标位置,0->60px;1->30px;
* times,day->白天;night->晚上;
* desc天气描述;
*/
function getIcon(local, times, desc) {
var iconWidth, url;
//图标尺寸判断;
if (local == 0) {
iconWidth = "80px";
} else {
iconWidth = "30px";
}
//图标类型判断;
if (times == "day") {
url = "img/day/"
} else {
url = "img/night/"
}
//天气描述图标;
switch (desc) {
case "晴":
return '
'
break;
case "多云":
return '
'
break;
case "阴":
return '
'
break;
case "阵雨":
return '
'
break;
case "雷阵雨":
return '
'
break;
case "雷阵雨并伴有冰雹":
return '
'
break;
case "雨夹雪":
return '
'
break;
case "小雨":
return '
'
break;
case "中雨":
return '
'
break;
case "大雨":
return '
'
break;
case "暴雨":
return '
'
break;
case "大暴雨":
return '
'
break;
case "特大暴雨":
return '
'
break;
case "阵雪":
return '
'
break;
case "小雪":
return '
'
break;
case "中雪":
return '
'
break;
case "大雪":
return '
'
break;
case "暴雪":
return '
'
break;
case "雾":
return '
'
break;
case "冻雨":
return '
'
break;
case "沙尘暴":
return '
'
break;
case "霾":
return '
'
break;
case "雨":
return '
'
break;
case "雪":
return '
'
break;
default:
return "异常"
}
}
html代码
风力
风向
天气现象
Done!