Question

发现Web音频Api我想绘制声音文件的波形。现在，我意识到某些浏览器中的图像尺寸限制，并尝试查找它们，但是它们似乎一直在变化（或者至少是内存差异，例如Chrome桌面与Chrome移动）。

我试图查找如何测试图像或Canvas / 2D Context是否可以达到一定大小而几乎没有成功。但是，在Firefox中测试此内容时，控制台确实出现错误，因此尝试了以下方法：

wfWidth = source.buffer.duration*100;
document.getElementById("waveform").width = wfWidth;
wfCtx = document.getElementById("waveform").getContext("2d");
var success = false;
while(success == false)
{
    try {
        var temp = wfCtx.getImageData(0,0,10,10); // this produced an error further down the code, so I use this as my test case.
        success = true;
    } catch(err) {
        wfWidth = wfWidth / 2;
        document.getElementById("waveform").width = wfWidth;
        wfCtx = document.getElementById("waveform").getContext("2d");
    }
    console.log(success);
}

这似乎在Firefox中确实有效，因为控制台首先输出false，表明画布太大，然后在画布宽度减半并显示波形后显示true。

但是，在桌面版Google Chrome浏览器中，画布似乎具有一定的大小（如滚动条所示），但它完全是空白的。右键单击以保存图像时，它是一个0字节的txt文件。在Chrome移动版（android）上，我得到了这张方形的悲伤小脸。猜猜这种检查方法在Chrome中不起作用。

测试画布是否正确，是否有效以及调整其大小的最佳方法是什么？

检查画布尺寸限制

0 个答案: