Published
Edited
Nov 9, 2020
Importers
Insert cell
md`# Data Fetch Example`
Insert cell
evaluations = {
const maxNumEvaluations = 4;

const urlParams = new URLSearchParams(window.location.search);
const pks = urlParams.getAll('pk');
let urls = pks.map(
pk => `https://grand-challenge.org/api/v1/evaluations/${pk}/`
);

return await Promise.all(
urls
.slice(0, maxNumEvaluations)
.map(url => fetch(url).then(response => response.json()))
);
}
Insert cell
viewof evalationSelector = {
if (evaluations.length > 1) {
const keys = Object.keys(evaluations);
let i = 0;
return slider({
value: this ? this.value : i,
step: 1,
max: keys.length - 1,
getValue: n => keys[n.value],
format: v => `${evaluations[v].title}`,
title: "Evaluation",
description: "Select Evaluation"
});
} else {
return input({
attributes: { hidden: true },
display: function() {
return "";
},
getValue: function() {
return "0";
}
});
}
}
Insert cell
evalationSelector
Insert cell
import { slider, input } from '@jashkenas/inputs'
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