Small adjustments to color sampling per meeting, commented out old ones (#122)

pull/126/head
mittimithai 2021-05-19 03:31:30 -07:00 zatwierdzone przez GitHub
rodzic b6be649342
commit 55e70a44b3
Nie znaleziono w bazie danych klucza dla tego podpisu
ID klucza GPG: 4AEE18F83AFDEB23
1 zmienionych plików z 58 dodań i 22 usunięć

Wyświetl plik

@ -4,19 +4,16 @@ import * as colorspaces from "colorspaces";
import { ColorTuple, hsluvToHex } from "hsluv"; import { ColorTuple, hsluvToHex } from "hsluv";
type RandomPaletteGenerator = (numEntries: number, rng: Random) => string[]; type RandomPaletteGenerator = (numEntries: number, rng: Random) => string[];
type ColorFunction = (rng: Random) => string[]; //type ColorFunction = (rng: Random) => string[];
export type RandomPaletteAlgorithm = export type RandomPaletteAlgorithm = "RGB" | "CIELUV" | "threevals";
| "RGB" // | "randgrey"
| "CIELUV" // | "threev15"
| "threevals" // | "threev30"
| "randgrey" // | "threev45"
| "threev15" // | "threev60"
| "threev30" // | "threev75"
| "threev45" // | "threev90";
| "threev60"
| "threev75"
| "threev90";
export const DEFAULT_RANDOM_PALETTE_ALGORITHM: RandomPaletteAlgorithm = export const DEFAULT_RANDOM_PALETTE_ALGORITHM: RandomPaletteAlgorithm =
"threevals"; "threevals";
@ -75,6 +72,7 @@ function createRandomCIELUVColor(rng: Random): string {
return randColorHex; return randColorHex;
} }
/*
function createRandGrey(rng: Random): string[] { function createRandGrey(rng: Random): string[] {
let L1 = rng.inInterval({ min: 0, max: 100 }); let L1 = rng.inInterval({ min: 0, max: 100 });
let L2 = rng.inInterval({ min: 0, max: 100 }); let L2 = rng.inInterval({ min: 0, max: 100 });
@ -96,7 +94,9 @@ function createRandGrey(rng: Random): string[] {
hexcolors = rng.uniqueChoices(hexcolors, hexcolors.length); hexcolors = rng.uniqueChoices(hexcolors, hexcolors.length);
return hexcolors; return hexcolors;
} }
*/
/*
function create3V180(angle1: number): ColorFunction { function create3V180(angle1: number): ColorFunction {
return (rng: Random): string[] => { return (rng: Random): string[] => {
let Ls = [25, 50, 75]; let Ls = [25, 50, 75];
@ -107,7 +107,6 @@ function create3V180(angle1: number): ColorFunction {
h3 = 360 * (((h1 + 180) / 360) % 1); h3 = 360 * (((h1 + 180) / 360) % 1);
let Hs = [h1, h2, h3]; let Hs = [h1, h2, h3];
console.log(Hs);
let Ss = [ let Ss = [
rng.fromGaussian({ mean: 100, stddev: 40 }), rng.fromGaussian({ mean: 100, stddev: 40 }),
@ -125,8 +124,44 @@ function create3V180(angle1: number): ColorFunction {
return hexcolors; return hexcolors;
}; };
} }
*/
function create3VColor(rng: Random): string[] { function threeVColor(rng: Random): string[] {
let L1 = rng.inInterval({ min: 10, max: 25 });
let L2 = rng.inInterval({ min: L1 + 25, max: 60 });
let L3 = rng.inInterval({ min: L2 + 25, max: 85 });
let Ls = [L1, L2, L3];
let angleI = rng.inInterval({ min: 0, max: 120 });
//Now we have 3 lightness values, pick a random hue and sat
let h1 = rng.inInterval({ min: 0, max: 360 }),
h2 = h1 + angleI,
h3 = 360 * ((((h1 + h2) / 2 + 180) / 360) % 1);
h2 = 360 * ((h2 / 360) % 1);
let Hs = [h1, h2, h3];
let Ss = [
rng.fromGaussian({ mean: 100, stddev: 40 }),
rng.fromGaussian({ mean: 100, stddev: 40 }),
rng.fromGaussian({ mean: 100, stddev: 40 }),
];
Ss = Ss.map((x) => clamp(x, 0, 100));
//zip
let hsls = Ls.map((k, i) => [Hs[i], Ss[i], k]);
let hexcolors = hsls.map((x) => hsluvToHex(x as ColorTuple));
//scramble order
hexcolors = rng.uniqueChoices(hexcolors, hexcolors.length);
return hexcolors;
}
/*
function threeVColor(rng: Random): string[] {
let lowL_Mean = 20.0, let lowL_Mean = 20.0,
medL_Mean = 40.0, medL_Mean = 40.0,
hiL_Mean = 70, hiL_Mean = 70,
@ -165,6 +200,7 @@ function create3VColor(rng: Random): string[] {
hexcolors = rng.uniqueChoices(hexcolors, hexcolors.length); hexcolors = rng.uniqueChoices(hexcolors, hexcolors.length);
return hexcolors; return hexcolors;
} }
*/
/** /**
* Factory function to take a function that generates a random color * Factory function to take a function that generates a random color
@ -205,14 +241,14 @@ const PALETTE_GENERATORS: {
} = { } = {
RGB: createSimplePaletteGenerator(createRandomRGBColor), RGB: createSimplePaletteGenerator(createRandomRGBColor),
CIELUV: createSimplePaletteGenerator(createRandomCIELUVColor), CIELUV: createSimplePaletteGenerator(createRandomCIELUVColor),
threevals: createTriadPaletteGenerator(create3VColor), threevals: createTriadPaletteGenerator(threeVColor),
randgrey: createTriadPaletteGenerator(createRandGrey), //randgrey: createTriadPaletteGenerator(createRandGrey),
threev15: createTriadPaletteGenerator(create3V180(15)), //threev15: createTriadPaletteGenerator(create3V180(15)),
threev30: createTriadPaletteGenerator(create3V180(15)), //threev30: createTriadPaletteGenerator(create3V180(15)),
threev45: createTriadPaletteGenerator(create3V180(45)), //threev45: createTriadPaletteGenerator(create3V180(45)),
threev60: createTriadPaletteGenerator(create3V180(60)), //threev60: createTriadPaletteGenerator(create3V180(60)),
threev75: createTriadPaletteGenerator(create3V180(75)), //threev75: createTriadPaletteGenerator(create3V180(75)),
threev90: createTriadPaletteGenerator(create3V180(90)), //threev90: createTriadPaletteGenerator(create3V180(90)),
}; };
export const RANDOM_PALETTE_ALGORITHMS = Object.keys( export const RANDOM_PALETTE_ALGORITHMS = Object.keys(