Interaction Design at Sheridan College
Public
Edited
Mar 31, 2024
1 fork
//dataTest = fetch("https://api.weather.gov/gridpoints/OKX/33,37/forecast").then((response) => response.json())
//Recall how APIs work - Fetches the endpoints, turns it to JSON and stuffs it into a variable as an object.
Plot.plot({
height: 600,
width: 250,
marginLeft: 50,
marginRight: 50,
color: {
// legend: true,
scheme: "Warm",
reverse: true,
domain: [0, 300],
},
y: {
type: "linear",
domain: [0, 300],
grid: true
},
// x: {
// type: "time",
// },
marks: [
Plot.barY(data, {
x: "city",
y: "airQualityIndex",
fill: "airQualityIndex", // This is for colour
tip: true
}),
Plot.ruleY([0])
]
})
// Plot.plot({
// marks: [
// Plot.barY(currentAQUS, {x: "City", y: "Pollution", sort: {x: "y", reverse: true}}),
// Plot.ruleY([0])
// ]
// })
// {
// const dataFields = Object.entries(dataCityAQ.data);
// return dataFields;
// dataFields(currentPlace =>{
// return {
// name : currentPlace.city
// }
// })
// }
// dataCityAQ.data.map(currentPlace =>{
// return {
// name : currentPlace.city
// }
// })
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.
