Question

我曾经使用Chrome，但我需要使用Firefox测试我的插件。我正在尝试捕获视频元素并将其绘制到画布上。在Chrome中一切正常，但在Firefox中，我遇到了这个令人讨厌的错误，我无法修复。

IndexSizeError: Index or size is negative or greater than the allowed amount

我正在使用以下代码行绘制到视频$("#video")[0]到画布$("#output")[0].getContext('2d')：

outputCtx.drawImage(video, 0,0, video.width, video.height, 0, 0, 1815, 1358);

我会在video.width和video.height值上得到错误。我已经制作了一个可以在Chrome中运行良好的JSFiddle，但在Firefox中出现错误：http://jsfiddle.net/ronnyrr/KD2bu/

Answer 1

尝试使用这些属性：

outputCtx.drawImage(video, 0,0, video.videoWidth, video.videoWeight,
                    0, 0, 1815, 1358);

源矩形必须始终位于源位图中。当其中一个参数在外部或0或负数时，会出现错误消息。

在Firefox中，宽度可能不会反映实际的视频大小。因此尝试videoWidth / Height属性或在最坏的情况下组合它们：

outputCtx.drawImage(video, 0,0,
                    video.videoWidth||video.width,
                    video.videoHeight||video.height,
                    0, 0, 1815, 1358);

希望这有帮助！

Firefox drawImage tot canvas错误：IndexSizeError：索引或大小为负数或大于允许的数量

1 个答案: