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

Question

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

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.

似乎暗示你可以做你所要求的，但仅限于渐变和可能的字体属性。