Published unlisted
Edited
Dec 10, 2020
Insert cell
Insert cell
Insert cell
viewof score_1 = swatch("rgb(0, 0, 255)")
Insert cell
viewof score_2 = swatch("rgb(137, 0, 225)")
Insert cell
viewof score_3 = swatch("rgb(224, 0, 149)")
Insert cell
viewof score_4 = swatch("rgb(246, 111, 187)")
Insert cell
viewof score_5 = swatch("rgb(255, 188, 203)")
Insert cell
htmlview = html`
Result 1: ${value1} <br />
Result 2: ${value2}
`
Insert cell
viewof value1_calc = slider({
min: 1,
max: 5,
step: 0.01,
value: 1,
})
Insert cell
viewof value2_calc = slider({
min: 1,
max: 5,
step: 0.01,
value: 1,
})
Insert cell
value1 = {
let result;
if (value1_calc <= 1) {
result = viewof score_1;
}
else if (value1_calc > 1 && value1_calc <=2 ) {
result = viewof score_2;
}
else if (value1_calc > 2 && value1_calc <=3) {
result = viewof score_3;
}
else if (value1_calc > 3 && value1_calc <=4) {
result = viewof score_4;
}
else if (value1_calc > 4 && value1_calc <=5) {
result = viewof score_5;
}
return result;
}
Insert cell
value2 = {
let result;
if (value2_calc <= 1) {
result = viewof score_1;
}
else if (value2_calc > 1 && value2_calc <= 2 ) {
result = viewof score_2;
}
else if (value2_calc > 2 && value2_calc <= 3) {
result = viewof score_3;
}
else if (value2_calc > 3 && value2_calc <= 4) {
result = viewof score_4;
}
else if (value2_calc > 3 && value2_calc <= 5) {
result = viewof score_5;
}
return result;
}
Insert cell
Insert cell
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