Public
Edited
Jan 8, 2024
Importers
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
city = {
if (!cityData.results) return "-";
if (cityData.results.length === 0) return "-";
return cityData.results[0];
}
Insert cell
cityData = openMeteoSearchCity(text)
Insert cell
weatherData = {
if (!city) return;
return openMeteoGetData(city);
}
Insert cell
async function openMeteoSearchCity(text) {
const data = await fetch(genCityUrl(encodeURIComponent(text)));
return data.json();
}
Insert cell
async function openMeteoGetData(cityObj) {
const data = await fetch(genDataUrl(cityObj));
return data.json();
}
Insert cell
Insert cell
function genDataUrl({ latitude, longitude }) {
return urlData.replace("__LAT__", latitude).replace("__LON__", longitude);
}
Insert cell
function genCityUrl(text) {
return urlCity.replace("_NAME_", text);
}
Insert cell
urlCity = "https://geocoding-api.open-meteo.com/v1/search?name=_NAME_&count=5&language=en&format=json"
Insert cell
urlData = "https://api.open-meteo.com/v1/forecast?latitude=__LAT__&longitude=__LON__&current=temperature_2m,relative_humidity_2m,is_day,precipitation,rain&hourly=temperature_2m,dew_point_2m,precipitation_probability,wind_speed_10m,wind_direction_10m&daily=temperature_2m_max,temperature_2m_min,sunrise,sunset&temperature_unit=fahrenheit&precipitation_unit=inch&timezone=America%2FNew_York"
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more