From 10cf56d3437078e9aa457990d278b86726660bc0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=8E=8B=E8=83=9C?= <2318857637@qq.com> Date: Mon, 15 Jun 2026 20:01:59 +0800 Subject: [PATCH] fix: lerp colors in current color mode --- src/color/p5.Color.js | 15 ++++++---- test/unit/color/creating_reading.js | 44 ++++++++++++++--------------- 2 files changed, 30 insertions(+), 29 deletions(-) diff --git a/src/color/p5.Color.js b/src/color/p5.Color.js index 29b5996fb3..038a7f183f 100644 --- a/src/color/p5.Color.js +++ b/src/color/p5.Color.js @@ -302,15 +302,18 @@ class Color { } lerp(color, amt, mode){ + const source = mode ? this.#toColorMode(mode)._color : this._color; + const target = mode ? color.#toColorMode(mode)._color : color._color; + // Find the closest common ancestor color space let spaceIndex = -1; while( ( - spaceIndex+1 < this._color.space.path.length || - spaceIndex+1 < color._color.space.path.length + spaceIndex+1 < source.space.path.length || + spaceIndex+1 < target.space.path.length ) && - this._color.space.path[spaceIndex+1] === - color._color.space.path[spaceIndex+1] + source.space.path[spaceIndex+1] === + target.space.path[spaceIndex+1] ){ spaceIndex += 1; } @@ -320,8 +323,8 @@ class Color { throw new Error('Cannot lerp colors. No common color space found'); } - const obj = range(this._color, color._color, { - space: this._color.space.path[spaceIndex].id + const obj = range(source, target, { + space: source.space.path[spaceIndex].id })(amt); return new Color(obj, mode || this.mode); diff --git a/test/unit/color/creating_reading.js b/test/unit/color/creating_reading.js index 31d7379802..b195911d90 100644 --- a/test/unit/color/creating_reading.js +++ b/test/unit/color/creating_reading.js @@ -71,33 +71,31 @@ suite('color/CreatingReading', function() { }); test('should correctly get lerp colors in HSL', function() { - // NOTE: This is equivalent to RGB case so is testing nothing new mockP5Prototype.colorMode(mockP5Prototype.HSL); var interA = mockP5Prototype.lerpColor(fromColor, toColor, 0.33); var interB = mockP5Prototype.lerpColor(fromColor, toColor, 0.66); - assert.closeTo(interA._color.coords[0], 37, 1); - assert.closeTo(interA._color.coords[1], 43, 1); + assert.closeTo(interA._color.coords[0], 352, 1); + assert.closeTo(interA._color.coords[1], 63, 1); assert.closeTo(interA._color.coords[2], 46, 1); - assert.closeTo(interB._color.coords[0], 345, 1); - assert.closeTo(interB._color.coords[1], 12, 1); + assert.closeTo(interB._color.coords[0], 301, 1); + assert.closeTo(interB._color.coords[1], 51, 1); assert.closeTo(interB._color.coords[2], 43, 1); }); test('should correctly get lerp colors in HSB', function() { - // NOTE: This is equivalent to RGB case so is testing nothing new mockP5Prototype.colorMode(mockP5Prototype.HSB); var interA = mockP5Prototype.lerpColor(fromColor, toColor, 0.33); var interB = mockP5Prototype.lerpColor(fromColor, toColor, 0.66); - assert.closeTo(interA._color.coords[0], 37, 1); - assert.closeTo(interA._color.coords[1], 60, 1); - assert.closeTo(interA._color.coords[2], 66, 1); + assert.closeTo(interA._color.coords[0], 352, 1); + assert.closeTo(interA._color.coords[1], 76, 1); + assert.closeTo(interA._color.coords[2], 75, 1); - assert.closeTo(interB._color.coords[0], 345, 1); - assert.closeTo(interB._color.coords[1], 20, 1); - assert.closeTo(interB._color.coords[2], 47, 1); + assert.closeTo(interB._color.coords[0], 301, 1); + assert.closeTo(interB._color.coords[1], 66, 1); + assert.closeTo(interB._color.coords[2], 65, 1); }); test.todo('should not extrapolate', function() { @@ -136,14 +134,14 @@ suite('color/CreatingReading', function() { var interA = mockP5Prototype.lerpColor(fromColor, toColor, 0.33); var interB = mockP5Prototype.lerpColor(fromColor, toColor, 0.66); - assert.closeTo(interA._color.coords[0], 37, 1); - assert.closeTo(interA._color.coords[1], 43, 1); + assert.closeTo(interA._color.coords[0], 352, 1); + assert.closeTo(interA._color.coords[1], 63, 1); assert.closeTo(interA._color.coords[2], 46, 1); assert.closeTo(interA._color.alpha, 0.38, 0.01); - assert.closeTo(interB._color.coords[0], 345, 1); - assert.closeTo(interB._color.coords[1], 11, 1); - assert.closeTo(interB._color.coords[2], 42, 1); + assert.closeTo(interB._color.coords[0], 301, 1); + assert.closeTo(interB._color.coords[1], 51, 1); + assert.closeTo(interB._color.coords[2], 43, 1); assert.closeTo(interB._color.alpha, 0.58, 0.01); }); @@ -152,14 +150,14 @@ suite('color/CreatingReading', function() { var interA = mockP5Prototype.lerpColor(fromColor, toColor, 0.33); var interB = mockP5Prototype.lerpColor(fromColor, toColor, 0.66); - assert.closeTo(interA._color.coords[0], 37, 1); - assert.closeTo(interA._color.coords[1], 60, 1); - assert.closeTo(interA._color.coords[2], 66, 1); + assert.closeTo(interA._color.coords[0], 352, 1); + assert.closeTo(interA._color.coords[1], 76, 1); + assert.closeTo(interA._color.coords[2], 75, 1); assert.closeTo(interA._color.alpha, 0.38, 0.01); - assert.closeTo(interB._color.coords[0], 345, 1); - assert.closeTo(interB._color.coords[1], 20, 1); - assert.closeTo(interB._color.coords[2], 47, 1); + assert.closeTo(interB._color.coords[0], 301, 1); + assert.closeTo(interB._color.coords[1], 66, 1); + assert.closeTo(interB._color.coords[2], 65, 1); assert.closeTo(interB._color.alpha, 0.58, 0.01); });