search
fetchData = async (name) => {
const fUrl = `https://api.pantheon.world/person?name=eq.${name}`;
return await fetch(fUrl).then((response) => response.json());
}
viewof fetched = Inputs.button("Fetch data", {value: [], reduce: () => {
return doFetch();
}});
fetched
doFetch = async () => {
let data = [];
for (let i = 0; i < selectedStore.length; i++) {
await new Promise(r => setTimeout(r, 600));
data.push(await fetchData(selectedStore[i].name));
}
return data;
}
Inputs.button("copy selection", {value: null, reduce: () => navigator.clipboard.writeText(JSON.stringify(fetched)) })
massaged = fetched.map(d => d[0])// example_data.map(d => d[0])
makeCard = (data) => {
const answer = `${data.birthyear} - ${data.deathyear} (aged: ${data.deathyear - data.birthyear}).<br> Born in ${data.bplace_name}, ${data.bplace_country}.<br><br> ${data.famous_for}`;
return `${data.name} (born); ${answer}
${data.name} (died); ${answer}`
}
makeCard(massaged[0])
Inputs.button("copy cards", {value: null, reduce: () => navigator.clipboard.writeText(massaged.map(makeCard).join("\n")) })
top20k_names
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.
