我注意到CanvasRenderingContext2D.createLinearGradient
在CanvasRenderingContext2D的原型上。
这意味着我们鼓励人们在他们打算使用的上下文中创建渐变(以及一些其他资源)。
但是,我可以在画布上创建资源并在另一个画布上使用它:
const ctx1 = document.getElementById('canv1').getContext('2d');
const ctx2 = document.getElementById('canv2').getContext('2d');
const grad = ctx1.createLinearGradient(0, 0, 100, 100);
grad.addColorStop(0, 'white');
grad.addColorStop(1, 'black');
ctx2.fillStyle = grad;
ctx2.fillRect(0, 0, 100, 100);
除了可能是幕后的资源生命周期管理之外,还有其他原因吗?
谢谢!
答案 0 :(得分:3)
令人惊讶的是,除了以下段落之外,这个问题还没有被解决,因为唯一的答案是主观的。
通过WHATWG HTML Living Standard查看createLinearGradient的位置或仅为CanvasRenderingContext2D
(2D上下文)对象/接口创建的其他对象的位置没有明确的原因,除了这些要求方法是界面的必要部分。
我的其余答案是主观的。
渐变不需要2D上下文,也不需要包含对画布或2D上下文的引用。有效地允许一个人完全移除它们(画布和2D上下文),准备好由GC处理。这表明没有与幕后发生的梯度相关的资源管理。
它的位置(在我看来)的原因很简单,没有2D上下文就不需要渐变。可以想象在创建任何2D上下文之前需要与样式相关的对象的场景,但是没有这种情况可以呈现不可克服的问题,因为没有上下文2D,渐变是不可用的并且代理对象可以满足入侵要求。
虽然我认为创建的渐变对象可能是SVG.linearGradient
接口,就像CanvasRenderingContext2D.currentTransform
作为SVG.matrix
接口的情况一样。从而提供在SVG和2D上下文之间共享资源的能力。这样做是有意义的,因为它们是相关的。
标准要求2D上下文支持这些方法,因此在其他地方实现它们将是多余的。