utils/ColorScheme.js
import {
schemeAccent,
schemeDark2,
schemePaired,
schemePastel1,
schemePastel2,
schemeSet1,
schemeSet2,
schemeSet3,
interpolateBrBG,
interpolatePRGn,
interpolatePiYG,
interpolatePuOr,
interpolateRdBu,
interpolateRdGy,
interpolateRdYlBu,
interpolateRdYlGn,
interpolateSpectral,
interpolateBlues,
interpolateGreens,
interpolateGreys,
interpolateOranges,
interpolatePurples,
interpolateReds,
interpolateBuGn,
interpolateBuPu,
interpolateGnBu,
interpolateOrRd,
interpolatePuBuGn,
interpolatePuBu,
interpolatePuRd,
interpolateRdPu,
interpolateYlGnBu,
interpolateYlGn,
interpolateYlOrBr,
interpolateYlOrRd,
schemeBrBG,
schemePRGn,
schemePiYG,
schemePuOr,
schemeRdBu,
schemeRdGy,
schemeRdYlBu,
schemeRdYlGn,
schemeSpectral,
schemeBlues,
schemeGreens,
schemeGreys,
schemeOranges,
schemePurples,
schemeReds,
schemeBuGn,
schemeBuPu,
schemeGnBu,
schemeOrRd,
schemePuBuGn,
schemePuBu,
schemePuRd,
schemeRdPu,
schemeYlGnBu,
schemeYlGn,
schemeYlOrBr,
schemeYlOrRd,
} from 'd3-scale-chromatic';
const categoricalColors = {
schemeaccent: schemeAccent,
schemedark: schemeDark2,
schemepaired: schemePaired,
schemepastel1: schemePastel1,
schemepastel2: schemePastel2,
schemeset1: schemeSet1,
schemeset2: schemeSet2,
schemeset3: schemeSet3,
};
const NUM_CATEGORIES_PER_SCHEME = 8;
const categoryForContinuousColors = {
BrBG: schemeBrBG[NUM_CATEGORIES_PER_SCHEME],
PRGn: schemePRGn[NUM_CATEGORIES_PER_SCHEME],
PiYG: schemePiYG[NUM_CATEGORIES_PER_SCHEME],
PuOr: schemePuOr[NUM_CATEGORIES_PER_SCHEME],
RdBu: schemeRdBu[NUM_CATEGORIES_PER_SCHEME],
RdGy: schemeRdGy[NUM_CATEGORIES_PER_SCHEME],
RdYlBu: schemeRdYlBu[NUM_CATEGORIES_PER_SCHEME],
RdYlGn: schemeRdYlGn[NUM_CATEGORIES_PER_SCHEME],
Spectral: schemeSpectral[NUM_CATEGORIES_PER_SCHEME],
blues: schemeBlues[NUM_CATEGORIES_PER_SCHEME],
greens: schemeGreens[NUM_CATEGORIES_PER_SCHEME],
greys: schemeGreys[NUM_CATEGORIES_PER_SCHEME],
oranges: schemeOranges[NUM_CATEGORIES_PER_SCHEME],
purples: schemePurples[NUM_CATEGORIES_PER_SCHEME],
reds: schemeReds[NUM_CATEGORIES_PER_SCHEME],
BuGn: schemeBuGn[NUM_CATEGORIES_PER_SCHEME],
BuPu: schemeBuPu[NUM_CATEGORIES_PER_SCHEME],
GnBu: schemeGnBu[NUM_CATEGORIES_PER_SCHEME],
OrRd: schemeOrRd[NUM_CATEGORIES_PER_SCHEME],
PuBuGn: schemePuBuGn[NUM_CATEGORIES_PER_SCHEME],
PuBu: schemePuBu[NUM_CATEGORIES_PER_SCHEME],
PuRd: schemePuRd[NUM_CATEGORIES_PER_SCHEME],
RdPu: schemeRdPu[NUM_CATEGORIES_PER_SCHEME],
YlGnBu: schemeYlGnBu[NUM_CATEGORIES_PER_SCHEME],
YlGn: schemeYlGn[NUM_CATEGORIES_PER_SCHEME],
YlOrBr: schemeYlOrBr[NUM_CATEGORIES_PER_SCHEME],
YlOrR: schemeYlOrRd[NUM_CATEGORIES_PER_SCHEME],
};
const divergingColors = {
BrBG: interpolateBrBG,
PRGn: interpolatePRGn,
PiYG: interpolatePiYG,
PuOr: interpolatePuOr,
RdBu: interpolateRdBu,
RdGy: interpolateRdGy,
RdYlBu: interpolateRdYlBu,
RdYlGn: interpolateRdYlGn,
Spectral: interpolateSpectral,
};
const sequentialColors = {
blues: interpolateBlues,
greens: interpolateGreens,
greys: interpolateGreys,
oranges: interpolateOranges,
purples: interpolatePurples,
reds: interpolateReds,
BuGn: interpolateBuGn,
BuPu: interpolateBuPu,
GnBu: interpolateGnBu,
OrRd: interpolateOrRd,
PuBuGn: interpolatePuBuGn,
PuBu: interpolatePuBu,
PuRd: interpolatePuRd,
RdPu: interpolateRdPu,
YlGnBu: interpolateYlGnBu,
YlGn: interpolateYlGn,
YlOrBr: interpolateYlOrBr,
YlOrR: interpolateYlOrRd,
};
export const singleColors = [
'#5F4690', '#1D6996', '#38A6A5', '#0F8554', '#73AF48', '#EDAD08',
'#E17C05', '#CC503E', '#94346E', '#6F4070', '#994E95', '#666666',
'#7F3C8D', '#11A579', '#3969AC', '#F2B701', '#E73F74', '#80BA5A',
'#E68310', '#008695', '#CF1C90', '#f97b72', '#4b4b8f', '#A5AA99',
];
export const getCategoricalColorNames = () => Object.keys(categoricalColors);
export const getDivergingColorNames = () => Object.keys(divergingColors);
export const getSequentialColorNames = () => Object.keys(sequentialColors);
export const getCategoricalColorScheme = name => categoricalColors[name];
export const getDivergingColorScheme = name => divergingColors[name];
export const getSequentialColorScheme = name => sequentialColors[name];
export const getCategoryForContinuousColorScheme = name => categoryForContinuousColors[name];