Canvas代码在IE9中不起作用 - 可能是alpha或globalCompositeOperation问题

Question

我有一个javascript例程，旨在闪烁的太阳光线。例程创建'numRays'光线，然后使用globalCompositeOperation ='copy'开始覆盖光线，并在最旧的光线上绘制透明光线。

您可以在此处查看该计划：Sun Ray Page

JSFiddle.net代码位于此处：JSFiddle Sun Rays（我不知道如何让它在JSFiddle上运行，所以如果有人可以修复我的小提琴，我也会很感激。）

（注意：为了诊断目的，我在擦除的光线周围留下了黄色笔划，因此您可以看到它们已被执行。）

该代码适用于Chrome和Firefox，但是，在IE9中，当我使擦除部分处于活动状态时，不会绘制原始光线。换句话说，如果我注释掉创建擦除笔划的部分，则会发生光线填充。如果不这样做，那么只会发生擦除笔划。

我测试了各种固定的alpha值，IE9似乎完美地处理了它们。我已经将这两个部分设置为globalCompositeOperation ='source-over'，但仍然没有获得原始光线。

有人可以帮助我更正此代码以使用IE9吗？

由于

Answer 1

它不能在jsfiddle中工作，因为你从不打电话给init()

IE9可能会破坏该行的脚本执行：

ctx.rotate(rayArray[currentRay]); // Rotate to the rayAngle

因为它会在前11次调用时抛出一个错误，因为你一直试图访问前10-11次未定义的值。

所以我将增量代码向下移动到ctx.rotate语句之后并添加了init。它在IE或FireFox中没有错误，但我无法知道它是否符合您的意图：

http://jsfiddle.net/Y5Y48/18/