Day 63: Open weather에서 아이콘 가져오기

9076 단어 100daysofcode
내 앱을 자동 업데이트하기 위해 열린 날씨에서 아이콘을 가져오는 작업을 했습니다.

<div class="left">
      <img id="weatherIcon" src="" alt="">
 </div>



let icon = data.weather[0].icon
const img = document.querySelector('#weatherIcon');
img.setAttribute('src', `http://openweathermap.org/img/wn/${icon}@2x.png`)


다음 7일 동안의 아이콘과 데이터도 가져왔습니다.

    await axios(`https://api.openweathermap.org/data/2.5/onecall?lat=33.441792&lon=-94.037689&exclude=hourly,minutely,current&appid=`,{
            "method": "GET"
        })
        .then(response=> {
            let data = response.data
            console.log(data)


            data.daily.forEach(day => {
                let icon = day.weather[0].icon

                const section = document.querySelector('.section3');
                const card = document.createElement('div')
                card.setAttribute('class','card')
                section.appendChild(card);

                const p = document.createElement('p')
                p.textContent = 'nextDay'
                card.appendChild(p)

                const innerCard = document.createElement('div')
                innerCard.setAttribute('class','innerCard')
                card.appendChild(innerCard)

                // const innerCard = document.querySelector('.innerCard')
                const img = document.createElement('img')
                img.setAttribute('src', `http://openweathermap.org/img/wn/${icon}.png`)
                innerCard.appendChild(img)

                const temp = document.createElement('p')
                temp.textContent = `${Math.round(day.temp.day - 273.15)}°`;
                innerCard.appendChild(temp)

                const weather = document.createElement('p')
                weather.textContent = day.weather[0].main
                innerCard.appendChild(weather)

            });

        })


63일차

좋은 웹페이지 즐겨찾기