質問編集履歴
2
余計なものを削除した
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -22,7 +22,6 @@
|
|
|
22
22
|
cx.drawImage(image,0,0);
|
|
23
23
|
var imageData = cx.getImageData(0,0,canvas.width,canvas.height);
|
|
24
24
|
var changedData = cx.createImageData(imageData);
|
|
25
|
-
//ここで画像を処理したい
|
|
26
25
|
cx2.putImageData(imageData,0,0);
|
|
27
26
|
};
|
|
28
27
|
image.src = "reiwa.jpg";
|
1
実現したいことの説明
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -1,7 +1,11 @@
|
|
|
1
1
|
```ここに言語を入力
|
|
2
|
+
|
|
2
3
|
以下のコードを実行するとUncaught DOMException: Failed to execute 'getImageData' on 'CanvasRenderingContext2D': The canvas has been tainted by cross-origin data.
|
|
3
4
|
というエラーが出ます。
|
|
4
5
|
どうすれば解消できるでしょうか？
|
|
6
|
+
このコードは指定した画像をcanvasで描画し、そのcanvasからgetImageData（）でデータを読み取り
|
|
7
|
+
別のcanvasで描画するというものです。
|
|
8
|
+
|
|
5
9
|
<html>
|
|
6
10
|
<body>
|
|
7
11
|
<canvas id = "reiwa" width = "329" height = "245" ></canvas>
|
|
@@ -18,6 +22,7 @@
|
|
|
18
22
|
cx.drawImage(image,0,0);
|
|
19
23
|
var imageData = cx.getImageData(0,0,canvas.width,canvas.height);
|
|
20
24
|
var changedData = cx.createImageData(imageData);
|
|
25
|
+
//ここで画像を処理したい
|
|
21
26
|
cx2.putImageData(imageData,0,0);
|
|
22
27
|
};
|
|
23
28
|
image.src = "reiwa.jpg";
|