我想针对天气显示不同的背景图像，而我要使用OpenWeatherMap来显示。我正在使用eberything，我正在使用5天的免费预测订阅。我想做的是在5天的预报上显示最后一天的天气，而不是当前的天气。查看文档，它似乎是设置开始日期和结束日期的参数，但是不确定如何将其集成到当前脚本中：https://openweathermap.org/forecast5

Codepen：Codepen:

脚本：

$(document).ready(function() {

//global variables
var city;
var countryCode;
var zip;
var regionName;

var brImg;
var temp;
var kelvin;
var tempMax;
var tempMin;
var high;
var low;
var unitLetter;

var weatherType;
var description;
var windspeed;
var humidity;

var iconStr;
var iconImg;
var windDir;

//grabs location using api and longitude and latitude 
$.getJSON("https://ipinfo.io",function(data) {
    city = data.city;
    countryCode = data.countryCode;
    zip = data.zip;
    regionName = data.regionName;

    //api courtesy of openweathermap.org  
    var api = 'https://api.openweathermap.org/data/2.5/weather?q=' + city + ',' + countryCode + '=&appid=483be4496e0ac89a51c09d6e4c62b367';

    //takes the data from the api and assigns it var   
    $.getJSON(api,function(dataTwo) {

        weatherType = dataTwo.weather[0].main;
        kelvin = dataTwo.main.temp;
        windspeed = dataTwo.wind.speed;
        humidity = dataTwo.main.humidity;
        tempMax = dataTwo.main.temp_max;
        tempMin = dataTwo.main.temp_min;
        brImg = dataTwo.weather[0].main;
        description = dataTwo.weather[0].description;
        iconStr = dataTwo.weather[0].icon;
        iconImg = 'https://openweathermap.org/img/w/' + iconStr + '.png';


        //Take the deg and convert to a compas direction
        var deg = dataTwo.wind.deg;
        windDir = getcardinal;

        function getcardinal(deg) {
            //easy to customize by changing the number of directions you have 
            var directions = 8;

            var degree = 360 / directions;
            deg = deg + degree / 2;

            if (deg >= 0 * degree && deg < 1 * degree)
                return "N";
            if (deg >= 1 * degree && deg < 2 * degree)
                return "NE";
            if (deg >= 2 * degree && deg < 3 * degree)
                return "E";
            if (deg >= 3 * degree && deg < 4 * degree)
                return "SE";
            if (deg >= 4 * degree && deg < 5 * degree)
                return "S";
            if (deg >= 5 * degree && deg < 6 * degree)
                return "SW";
            if (deg >= 6 * degree && deg < 7 * degree)
                return "W";
            if (deg >= 7 * degree && deg < 8 * degree)
                return "NW";
            //Should never happen: 
            return "N";
        }


        //determine fahrenheit or celsius based on countryCode and convert temp in kelvin to fahrenheit or celsius

        if (countryCode == 'US' || 'BS' || 'BZ' || 'KY' || 'PL') {
            unitLetter = '°F';
        } else {
            unitLetter = '°C';
        }

        if (unitLetter == '°F') {
            temp = (kelvin * (9 / 5) - 459.67).toFixed(1);
            high = (tempMax * (9 / 5) - 459.67).toFixed(1);
            low = (tempMin * (9 / 5) - 459.67).toFixed(1);
        } else {
            temp = (kelvin - 273.15).toFixed(1);
            high = (tempMax - 273.15).toFixed(1);
            low = (tempMin - 273.15).toFixed(1);
        }

        //assigns var to id in html  
        $("#city").html(city);
        $("#zip").html(zip + "," + countryCode);
        $("#weatherType").html(weatherType);
        $("#temp").html(temp + unitLetter);
        $("#high").html(high + unitLetter);
        $("#low").html(low + unitLetter);
        $("#windspeed").html(windspeed + "m/s");
        $("#deg").html(deg);
        $("#humidity").html(humidity + "%");
        $("#description").html(description);
        $("#icon").html('<img src="' + iconImg + '">');
        $("#windDir").html(windDir);

        //goal...have a different background photo for each type of weather.    
        if (brImg !== 'undefined') {
            $('.weather_wrapper').removeclass('backgroundClear backgroundClouds backgroundDrizzle backgroundRain backgroundThunderstorm backgroundsnow backgroundAtmosphere backgroundExtreme backgroundAdditional backgroundDef')
                .addClass('background' + brImg);
        } else {
            $('.weather_wrapper').removeclass('background01n background02n background09n background10n background11n background13n backgroundDef')
                .addClass('backgroundDef');
        }

    });
});
});