There are plenty of weather APIs out there, but none of them are as easy to use, or as cheap as this one. The API is completely free and requires only a few lines of code to be set up.
Setup
All you have to do is paste the following script element into your HTML file:
Usage
Once the API is set up, you can use the function getWeather(coordinates) to get the weather data in the inputted coordinates.
The parameter coordinates can be either an array like this: getWeather([40.7128, -74.0060]). It can also be a string like this: getWeather("40.7128,-74.0060"). Remember that with the coordinates, north is positive while south is negative and east is positive while west is negative. For example, "40.7128° N, 74.0060° W" would be "40.7128,-74.0060."
The function will return a promise, so to actually use the data you must use the .then() method. For example, the following will log an object containing the weather data from New York City to the console:
getWeather("40.7128,-74.0060").then(data => {
console.log(data);
})
The object returned contains several properties that describe the weather in the inputted location.
Data Properties
Property Name
What it Means
Data Type
airQualityIndex
A number ranging from 0 to 500 describing the amount of pollution in the air. If this value is low, it means the air quality is good. If this value is high, it means the air quality is poor.
Number
coordinates
The coordinates that were used to get the original weather data.
Array
description
A basic description of the weather. Some examples include "Cloudy," "Clear," "Fair," "Mostly Cloudy," "Partly Cloudy," and "Sunny."
String
dewPoint
According to Wikipedia, dew point is "the temperature to which air must be cooled to become saturated with water vapor". This property will be a number that indicates the dew point in Fahrenheit.
Number
feelsLike
What the temperature feels like outside due to the wind, sun, and other factors measured in Fahrenheit.
Number
high
The highest predicted temperature in Fahrenheit. Sometimes the value will be undefined, meaning the highest temperature was unpredictable.
Number
humidity
A decimal number indicating the humidity from a scale of 0 to 1.
Number
isSunUp
Wether or not the sun was up at the time the weather data was accessed. Note that it will not indicate wether or not the sun is up presently, rather if the sun was up when the data was accessed.
Boolean
Location
The name of the city/town where the weather is being observed.
String
low
The lowest predicted temperature in Fahrenheit. Sometimes the value will be undefined, meaning the lowest temperature was unpredictable.
Number
moonPhase
The phase the moon is taking in the lunar cycle.
String
pressure
The atmospheric pressure measured in inches.
Number
rainChance
The chances it will rain today as a number from a scale of 0 to 1.
Number
sunrise
The time in which the sun rises reported in an am-pm format. For example, "11:00 PM" or "8:27 AM."
String
sunset
The time in which the sun sets reported in an am-pm format. For example, "11:00 PM" or "8:27 AM."
String
temperature
The temperature in Fahrenheit.
Number
time
The current time reported in an am-pm format. For example, "11:00 PM" or "8:27 AM."
String
timezone
The timezone reported in its abbreviated form. For example, "EST" or "UTC."
String
uvIndex
According to Wikipedia, UV index is a "measurement of the strength of sunburn-producing ultraviolet radiation at a particular place and time." The UV index is reported as a number from a scale of 0 to 1.
Number
visibility
The number of miles visible under the current weather conditions.
Number
windDirection
The direction in which the wind blows. Note that 0 is South, 180 is North, 90 is west, and 270 is east.
Number
windSpeed
The speed of the wind measured in miles per hour.
Number
Demo
Using geolocation coordinates, we can get the user's latitude and longitude and call getWeather() with the coordinates to get the weather data of the user.
Get basic weather data from your location (it takes a few seconds to calculate your latitude and longitude):