Open Weather Map

[pankaj11koundal]

Can't find open weather map API on rapid Api website and alternate or some sort of help will be appreciated.

[GeomaticaNet]

same problem here

[gitpk-0]

You can make a free account on the OpenWeather website.

Assuming you have created the .env file to hide your api keys you can then update the getWeatherData function in the js file of the api folder:

export const getWeatherData = async (lat, lng) => {
  try {
    const apiKey = process.env.REACT_APP_OPEN_WEATHER_API_KEY;
    const { data } = await axios.get(
      `https://api.openweathermap.org/data/2.5/weather?lat=${lat}&lon=${lng}&appid=${apiKey}`
    );

    return data;
  } catch (error) {
    console.log(error);
  }
};

Additionally, the img src will need to be updated in the Map.jsx file:

{weatherData?.list?.map((data, i) => (
          <div key={i} lat={data.coord.lat} lng={data.coord.lon}>
            <img
              src={`https://openweathermap.org/img/wn/${data.weather[0].icon}.png`}
              height={75}
              alt=""
            />
          </div>
        ))}

When console.log'd, the api calls return the expected data with these updates, however, I haven't been able to get the weather icons to successfully render on the map.