Wise Fool.
Visioneer.
code = ({
"none": { color: null , multiplier: null, tolerance: .4000, code: null, letter: "M" , },
"-3": { color: "pink" , multiplier: -3 , tolerance: null , code: "PK", letter: null, },
"-2": { color: "silver", multiplier: -2 , tolerance: .2000, code: "SR", letter: "K" , },
"-1": { color: "gold" , multiplier: -1 , tolerance: .1000, code: "GD", letter: "J" , },
"0": { color: "black" , multiplier: 0 , tolerance: null , code: "BK", letter: null, },
"1": { color: "brown" , multiplier: +1 , tolerance: .0100, code: "BN", letter: "F" , },
"2": { color: "red" , multiplier: +2 , tolerance: .0200, code: "RD", letter: "G" , },
"3": { color: "orange", multiplier: +3 , tolerance: .0005, code: "OG", letter: "W" , },
"4": { color: "yellow", multiplier: +4 , tolerance: .0002, code: "YE", letter: "P" , },
"5": { color: "green" , multiplier: +5 , tolerance: .0050, code: "GN", letter: "D" , },
"6": { color: "blue" , multiplier: +6 , tolerance: .0025, code: "BU", letter: "C" , },
"7": { color: "violet", multiplier: +7 , tolerance: .0010, code: "VT", letter: "B" , },
"8": { color: "grey" , multiplier: +8 , tolerance: .0001, code: "GY", letter: "L" , },
"9": { color: "white" , multiplier: +9 , tolerance: null , code: null, letter: null, },
})
tolerances = Object.values(code)
.filter(k => k.tolerance !== null)
.sort((a, b) => b.tolerance - a.tolerance)
.map((k, i) => ({E: E(i), tolerance: k.tolerance, color: k.color}))
function ecc() {
const state = {
colorSpace: "RAL",
}
const raw = (fraction) => ten(fraction)
return ({
E,
ten,
domain: {min: 0, max: E(6)},
raw,
tolerances: Object.values(code)
.filter(k => k.tolerance !== null)
.sort((a, b) => b.tolerance - a.tolerance)
.map((k, i) => ({E: E(i), tolerance: k.tolerance, color: k.color})),
color(key) {
if (!(key in code)) key = "☹"
const couleur = code[key].color
return { key, background: mapcolor(couleur), fill: contrast(couleur) }
},
colorSpace(s) {
if (s !== undefined && (s === "RAL" || s === "HTML"))
state.colorSpace = s
return state.colorSpace
},
mapcolor,
code,
colors,
contrast,
digit(n, hideNumber) { // digit() renders a single high contrast digit as a <span>.
const ul = n < 0 ? " text-decoration:underline;" : "" // underline negative digits
const {fill, background} = this.color(n)
const d = hideNumber === true ? " " : isNaN(n) ? n : Math.abs(n) // n can be non-digit character
const thin = `<span>&emdash;</span>`
return `<span style="color:${fill}; background-color:${background};${ul}">${d}</span>`
},
digits(x) { // returns a string of digit()s, one for each digit in its input array.
return (x.length < 4 ? "<span> </span>" : "") + x.map(k => this.digit(k)).join("") // leading blanks
},
bands(value, tolerance) {
return `<span style="font-family: Courier; font-size:400%; font-weight:bold;">${this.digits(value)}${(tolerance !== undefined) ? " " + this.digit(tolerance, true) : ""}</span>`
},
})
}
contrast = c => new Set(["white", "yellow", "gold", "silver", "pink"]).has(c) ? "black" : "white"
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.
