added paletteLerp

src/color/creating_reading.js

@@ -1068,6 +1068,61 @@ p5.prototype.lerpColor = function(c1, c2, amt) {
   return this.color(l0, l1, l2, l3);
 };
 
+/**
+ * Blends multiple colors to find a color between them.
+ *
+ * The `amt` parameter specifies the amount to interpolate between the color
+ * stops which are colors at each `amt` value "location" with `amt` values
+ * that are between 2 color stops interpolating between them based on its relative
+ * distance to both.
+ *
+ * The way that colors are interpolated depends on the current
+ * <a href="#/colorMode">colorMode()</a>.
+ *
+ * @method paletteLerp
+ * @param  {[p5.Color, Number][]} colors_stops color stops to interpolate from
+ * @param  {Number} amt number to use to interpolate relative to color stops
+ * @return {p5.Color} interpolated color.
+ *
+ * @example
+ * <div>
+ * <code>
+ * function setup() {
+ *   createCanvas(400, 400);
+ * }
+ *
+ * function draw() {
+ *   // The background goes from white to red to green to blue fill
+ *   background(paletteLerp([
+ *     ['white', 0],
+ *     ['red', 0.05],
+ *     ['green', 0.25],
+ *     ['blue', 1]
+ *   ], millis() / 10000 % 1));
+ * }
+ * </code>
+ * </div>
+ */
+p5.prototype.paletteLerp = function(color_stops, amt) {
+  const first_color_stop = color_stops[0];
+  if (amt < first_color_stop[1])
+    return this.color(first_color_stop[0]);
+
+  for (let i = 1; i < color_stops.length; i++) {
+    const color_stop = color_stops[i];
+    if (amt < color_stop[1]) {
+      const prev_color_stop = color_stops[i - 1];
+      return this.lerpColor(
+        this.color(prev_color_stop[0]),
+        this.color(color_stop[0]),
+        (amt - prev_color_stop[1]) / (color_stop[1] - prev_color_stop[1])
+      );
+    }
+  }
+
+  return this.color(color_stops[color_stops.length - 1][0]);
+};
+
 /**
  * Gets the lightness value of a color.
  *