Public
Edited
Apr 15, 2024
1 fork
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
selIndexes = selectedColors.map(term => c3.terms.findIndex(e => e == term));
Insert cell
// First 20 colors
colorGrid(c3.color.slice(0, 20))
Insert cell
function colorGrid(colors) {
return htl.html`<div>${colors.map(
(c) =>
htl.html`<div style="
// line-height:1px;
display: inline-block;
// width: 30px;
height: 30px;
// font-size: 2pt;
margin-right: 2px;
padding: 5px;
font-size: 8pt;
font-family: courier;

background-color:${c.css(
"rgb"
)}"><span style="color: white;
mix-blend-mode: difference;">
${c.css("rgb")}
</span></div>`
)}</div>`;
}
Insert cell
c3 = import("https://cdn.skypack.dev/c3-module@1.1.1?min")
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