et merci de me permettre de rejoindre ce forum
je commence a programmer en javascript avec Visual studio code
mon problème viens de getimagedata
sur un Canvas je dessine des formes géométriques et avec getimagedata j'arrive a récupérer une portion
mais si c'est une photo ma capture est blanche
je joint mon code JS
Code : Tout sélectionner
var canvas = document.getElementById('myCanvas');
let ctx = canvas.getContext('2d'),
cW = canvas.width,
cH = canvas.height,
imgW = 120,
imgH = 120;
var img_chat = document.createElement("img");
img_chat.onload = function() {
ctx.drawImage(img_chat, 4,4,100,100);
ctx.drawImage(canvas,160,4);
};
img_chat.src="bitma.bmp" ;
var data = new Uint8Array(imgW * imgH * 4);
crypto.getRandomValues(data);
var img = new ImageData(new Uint8ClampedArray(data.buffer), imgW, imgH);
ctx.putImageData(img, 0, 0);
ctx.fillStyle = "yellow";
ctx.fillRect(2,2,20,20);
function drawpixel(ctx) {
ctx.fillStyle = "blue";
ctx.fillRect(2,2,50,50);
var imgd = ctx.getImageData(4,4,70,70);
var pix = imgd.data;
for (var i = 0, n = pix.length; i < n; i += 4) {
pix[i ] = pix[i ]; // red
pix[i+1] = pix[i+1]; // green
pix[i+2] = pix[i+2]; // blue
// i+3 is alpha (the fourth element)
}
ctx.putImageData(imgd, 150, 300);
}
drawpixel(ctx);
Code : Tout sélectionner
<canvas id="myCanvas" width="550" height="510"></canvas>;
<script>
</script>
<input type="button" value="Cliquer ici pour lancer" onclick="drawpixel();"/>
<script src="script.js" defer></script>
<link href="style.css" rel="stylesheet">
merci d'avance de votre aide
