js生成渐变颜色数组

可以使用 JavaScript 的 CanvasRenderingContext2D.createLinearGradient() 方法来生成渐变色数组。

首先，需要创建一个 Canvas 元素并获取它的 2D 渲染上下文：

const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');

然后，使用 createLinearGradient() 方法创建一个线性渐变，并设置渐变的起点和终点：

const gradient = ctx.createLinearGradient(0, 0, 100, 0);

最后，使用 addColorStop() 方法向渐变中添加颜色，并设置每个颜色的停止位置：

gradient.addColorStop(0, 'red');
gradient.addColorStop(0.5, 'yellow');
gradient.addColorStop(1, 'green');

你可以使用这个渐变作为 canvas 的 fillStyle 或 strokeStyle，或者将其转换为 CSS 样式字符串，例如：

const gradientCss = gradient.toString();// 输出 "linear-gradient(0deg, red 0%, yellow 50%, green 100%)"

然后就可以将这个 CSS 样式字符串用于其他元素的背景色或边框色等。