1

何らかの理由で、以下のコードは機能しません。の行で停止しgetImageDataます。IE9 は次のエラーをスローします: SCRIPT5022: DOM Exception: INDEX_SIZE_ERR (1). これを解決する回避策はありますか? ただし、Chrome と FF の両方で動作します。

//Select our canvas and context
var canvas = document.getElementById("imageCanvas");
var context = canvas.getContext('2d');
//Select the image from the DOM
var selectedImage = document.getElementById("image");

//Draw the image to the canvas then read in the data
context.drawImage(selectedImage, 0, 0);
var originalLakeImageData = context.getImageData(0,0, width, height);

//Image data is now stored in an array in the form
//originalLakeImageData.data = [r1, g1, b1, a1, r2, g2, b2, a2....]

注: 上記のコードは私のコードではありません。ソースはこちら。ただし、私の問題はこの例と同じです。エラー IE9 を表示するには、このリンクを試してください

4

1 に答える 1

0

別の質問を検索しているときに、あなたの質問に出くわしました。発生している問題は、CSS でoldImageが に設定されていることに関係しています。display: noneこれにより、属性widthとheight属性がゼロになります。

を使ってみてくださいvisibility: hidden。CSSdisplay:noneは、要素がまったく表示されないことを意味しますが、要素は存在するが表示されないことをvisibility:hidden意味します。わずかな違いですが、例が機能するはずです。

絶対配置と z-index を使用して、表示したい画像の背後にある他の画像を「隠す」こともできます。

于 2012-11-17T00:38:36.507 に答える