javascript - 我可以将从 Canvas 上下文创建的渐变应用到其他 Canvas 上下文吗？

Question

我可以将从 Canvas 上下文创建的渐变应用于其他 Canvas 上下文，如下面的代码吗？

var canvasContextA = document.getElementById("canvasA").getContext("2d");
var canvasContextB = document.getElementById("canvasB").getContext("2d");

var gradientFromCanvasContextA = canvasContextA.createLinearGradient(0, 0, 100, 0);
gradientFromCanvasContextA.addColorStop(0, "black");
gradientFromCanvasContextA.addColorStop(1, "white");

canvasContextB.fillStyle = gradientFromCanvasContextA;

你能根据标准给我一个答案吗？ 这是未定义的行为吗？

Answer 1

有趣的问题。我在 Canvas 2D Specs 中找到了这张纸条:

In the case of addColorStop() on CanvasGradient, the "computed value of the 'color' property" for the purposes of determining the computed value of the currentColor keyword is always fully opaque black (there is no associated element). [CSSCOLOR]

This is because CanvasGradient objects are canvas-neutral — a CanvasGradient object created by one canvas can be used by another, and there is therefore no way to know which is the "element in question" at the time that the color is specified.

似乎暗示您可以按照您的要求进行操作，但仅限于渐变和可能的字体属性。