Add qualitative palettes for coloring by categorical property (#384)

Add tab10, tab20, tab20b, and tab20c palettes from matplotlib (https://matplotlib.org/stable/users/explain/colors/colormaps.html#qualitative)
lab-cosmo · Oct 22, 2024 · e8d8421 · e8d8421
1 parent 59befb4
commit e8d8421
Showing 1 changed file with 156 additions and 0 deletions.
diff --git a/src/map/colorscales.ts b/src/map/colorscales.ts
@@ -815,6 +815,158 @@ const BRG: RGBColorMap = [
     [1.0, [0, 255, 0]],
 ];
 
+const TAB10: RGBColorMap = [
+    [0.0, [31, 119, 180]],
+    [0.1, [31, 119, 180]],
+    [0.1, [255, 127, 14]],
+    [0.2, [255, 127, 14]],
+    [0.2, [44, 160, 44]],
+    [0.3, [44, 160, 44]],
+    [0.3, [214, 39, 40]],
+    [0.4, [214, 39, 40]],
+    [0.4, [148, 103, 189]],
+    [0.5, [148, 103, 189]],
+    [0.5, [140, 86, 75]],
+    [0.6, [140, 86, 75]],
+    [0.6, [227, 119, 194]],
+    [0.7, [227, 119, 194]],
+    [0.7, [127, 127, 127]],
+    [0.8, [127, 127, 127]],
+    [0.8, [188, 189, 34]],
+    [0.9, [188, 189, 34]],
+    [0.9, [23, 190, 207]],
+    [1.0, [23, 190, 207]],
+];
+
+const TAB20: RGBColorMap = [
+    [0.0, [31, 119, 180]],
+    [0.05, [31, 119, 180]],
+    [0.05, [174, 199, 232]],
+    [0.1, [174, 199, 232]],
+    [0.1, [255, 127, 14]],
+    [0.15, [255, 127, 14]],
+    [0.15, [255, 187, 120]],
+    [0.2, [255, 187, 120]],
+    [0.2, [44, 160, 44]],
+    [0.25, [44, 160, 44]],
+    [0.25, [152, 223, 138]],
+    [0.3, [152, 223, 138]],
+    [0.3, [214, 39, 40]],
+    [0.35, [214, 39, 40]],
+    [0.35, [255, 152, 150]],
+    [0.4, [255, 152, 150]],
+    [0.4, [148, 103, 189]],
+    [0.45, [148, 103, 189]],
+    [0.45, [197, 176, 213]],
+    [0.5, [197, 176, 213]],
+    [0.5, [140, 86, 75]],
+    [0.55, [140, 86, 75]],
+    [0.55, [196, 156, 148]],
+    [0.6, [196, 156, 148]],
+    [0.6, [227, 119, 194]],
+    [0.65, [227, 119, 194]],
+    [0.65, [247, 182, 210]],
+    [0.7, [247, 182, 210]],
+    [0.7, [127, 127, 127]],
+    [0.75, [127, 127, 127]],
+    [0.75, [199, 199, 199]],
+    [0.8, [199, 199, 199]],
+    [0.8, [188, 189, 34]],
+    [0.85, [188, 189, 34]],
+    [0.85, [219, 219, 141]],
+    [0.9, [219, 219, 141]],
+    [0.9, [23, 190, 207]],
+    [0.95, [23, 190, 207]],
+    [0.95, [158, 218, 229]],
+    [1.0, [158, 218, 229]],
+];
+
+const TAB20B: RGBColorMap = [
+    [0.0, [57, 59, 121]],
+    [0.05, [57, 59, 121]],
+    [0.05, [82, 84, 163]],
+    [0.1, [82, 84, 163]],
+    [0.1, [107, 110, 207]],
+    [0.15, [107, 110, 207]],
+    [0.15, [156, 158, 222]],
+    [0.2, [156, 158, 222]],
+    [0.2, [99, 121, 57]],
+    [0.25, [99, 121, 57]],
+    [0.25, [140, 162, 82]],
+    [0.3, [140, 162, 82]],
+    [0.3, [181, 207, 107]],
+    [0.35, [181, 207, 107]],
+    [0.35, [206, 219, 156]],
+    [0.4, [206, 219, 156]],
+    [0.4, [140, 109, 49]],
+    [0.45, [140, 109, 49]],
+    [0.45, [189, 158, 57]],
+    [0.5, [189, 158, 57]],
+    [0.5, [231, 186, 82]],
+    [0.55, [231, 186, 82]],
+    [0.55, [231, 203, 148]],
+    [0.6, [231, 203, 148]],
+    [0.6, [132, 60, 57]],
+    [0.65, [132, 60, 57]],
+    [0.65, [173, 73, 74]],
+    [0.7, [173, 73, 74]],
+    [0.7, [214, 97, 107]],
+    [0.75, [214, 97, 107]],
+    [0.75, [231, 150, 156]],
+    [0.8, [231, 150, 156]],
+    [0.8, [123, 65, 115]],
+    [0.85, [123, 65, 115]],
+    [0.85, [165, 81, 148]],
+    [0.9, [165, 81, 148]],
+    [0.9, [206, 109, 189]],
+    [0.95, [206, 109, 189]],
+    [0.95, [222, 158, 214]],
+    [1.0, [222, 158, 214]],
+];
+
+const TAB20C: RGBColorMap = [
+    [0.0, [49, 130, 189]],
+    [0.05, [49, 130, 189]],
+    [0.05, [107, 174, 214]],
+    [0.1, [107, 174, 214]],
+    [0.1, [158, 202, 225]],
+    [0.15, [158, 202, 225]],
+    [0.15, [198, 219, 239]],
+    [0.2, [198, 219, 239]],
+    [0.2, [230, 85, 13]],
+    [0.25, [230, 85, 13]],
+    [0.25, [253, 141, 60]],
+    [0.3, [253, 141, 60]],
+    [0.3, [253, 174, 107]],
+    [0.35, [253, 174, 107]],
+    [0.35, [253, 208, 162]],
+    [0.4, [253, 208, 162]],
+    [0.4, [49, 163, 84]],
+    [0.45, [49, 163, 84]],
+    [0.45, [116, 196, 118]],
+    [0.5, [116, 196, 118]],
+    [0.5, [161, 217, 155]],
+    [0.55, [161, 217, 155]],
+    [0.55, [199, 233, 192]],
+    [0.6, [199, 233, 192]],
+    [0.6, [117, 107, 177]],
+    [0.65, [117, 107, 177]],
+    [0.65, [158, 154, 200]],
+    [0.7, [158, 154, 200]],
+    [0.7, [188, 189, 220]],
+    [0.75, [188, 189, 220]],
+    [0.75, [218, 218, 235]],
+    [0.8, [218, 218, 235]],
+    [0.8, [99, 99, 99]],
+    [0.85, [99, 99, 99]],
+    [0.85, [150, 150, 150]],
+    [0.9, [150, 150, 150]],
+    [0.9, [189, 189, 189]],
+    [0.95, [189, 189, 189]],
+    [0.95, [217, 217, 217]],
+    [1.0, [217, 217, 217]],
+];
+
 interface ColorMaps {
     [key: string]: [number, string][];
 }
@@ -833,4 +985,8 @@ export const COLOR_MAPS: ColorMaps = {
     'twilight (periodic)': rgb_to_plotly(TWILIGHT),
     'twilight dark (periodic)': rgb_to_plotly(TWILIGHT_SHIFTED),
     'hsv (periodic)': rgb_to_plotly(HSV),
+    tab10: rgb_to_plotly(TAB10),
+    tab20: rgb_to_plotly(TAB20),
+    tab20b: rgb_to_plotly(TAB20B),
+    tab20c: rgb_to_plotly(TAB20C),
 };