Weather.js

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 factos 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):