Public
Edited
May 21
Insert cell
Insert cell
Insert cell
Insert cell
swatches(d3.quantize(d3.interpolateHcl(iptColorInterp.c1,iptColorInterp.c2),nQuantize) )
Insert cell
Insert cell
Insert cell
Insert cell
Legend(d3.scaleQuantize([1, nQuantize], d3.quantize(slctInterpolator.f, nQuantize-1)), {height:70, width:500} )
Insert cell
slctInterpolator.name
Insert cell
Legend(d3.scaleQuantize([1, 10], d3.schemePurples[9]))
Insert cell
d3.schemePurples[9].length
Insert cell
Swatches(d3.scaleOrdinal(["Wholesale and Retail Trade", "Manufacturing", "Leisure and hospitality", "Business services", "Construction", "Education and Health", "Government", "Finance", "Self-employed", "Other"], d3.schemeTableau10), {
columns: "180px"
})
Insert cell
d3.pairs(['r','g','b']).concat()
Insert cell
{
let eixos=['r','g','b']
let comb = eixos.forEach( function(d){
let diffSet = d3.difference( eixos,[d] );
return d3.cross( [d], d3.pairs(diffSet,diffSet) )
})
return comb;
}
Insert cell
d3.cross( d3.difference( ['r','b',"g"],['b']) )
Insert cell
{
const svgSize={height:400, width:800};
const svg = d3.create("svg").attr("height",svgSize.height).attr("width",svgSize.width);

let base = "rgb" //x,y,z
return svg.node();
}
Insert cell
Insert cell
import {Legend, Swatches} from "@d3/color-legend"
Insert cell
import {swatch, swatches} from "@d3/working-with-color"
Insert cell
Insert cell
colors_file_mdn = FileAttachment("Named_colors_MDN@1.json").json()
Insert cell
colors_file = FileAttachment("Named_colors.json").json()
Insert cell
Insert cell
named_colors_mdn = colors_file_mdn.list[1].colors
Insert cell
named_colors = d3.merge(colors_file.list.map(d=>d.colors))
Insert cell
Insert cell
{
//named_colors.map(d=> (({ color, hex}) => ({ color, hex}))(d) //destructuring for making both sets have exactly the same properties
let set1 = new Set( named_colors.map(d=>d.color.toLowerCase()) );
let setMdn = new Set( named_colors_mdn.map(d=>d.color.toLowerCase()) );
return set1.symmetricDifference(setMdn)
//return set1.intersection(setMdn)
}
Insert cell
named_colors.map(d=>d.color)
Insert cell
nm_colors_obj = {
let obj={};
named_colors_mdn.forEach((d)=>obj[d.color]=d.hex)
return obj;}
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