-
Notifications
You must be signed in to change notification settings - Fork 0
/
IAtransformFotoCores=pretoEbranco.html
47 lines (39 loc) · 1.38 KB
/
IAtransformFotoCores=pretoEbranco.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Black and White Image Converter</title>
</head>
<body>
<h1>Transformar imagens para preto e branco</h1>
<input type="file" id="imageInput" accept="image/*">
<img id="output" src="https://avatars.mds.yandex.net/get-direct/5338229/jeSmdOD0WymVL-G_drBicw/wy300" alt="Converted Image">
<script>document.getElementById('imageInput').addEventListener('change', function(event) {
const file = event.target.files[0];
const reader = new FileReader();
reader.onload = function() {
const img = new Image();
img.src = reader.result;
img.onload = function() {
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
canvas.width = img.width;
canvas.height = img.height;
ctx.drawImage(img, 0, 0);
const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);
const data = imageData.data;
for (let i = 0; i < data.length; i += 4) {
const avg = (data[i] + data[i + 1] + data[i + 2]) / 3;
data[i] = avg;
data[i + 1] = avg;
data[i + 2] = avg;
}
ctx.putImageData(imageData, 0, 0);
document.getElementById('output').src = canvas.toDataURL();
};
};
reader.readAsDataURL(file);
});</script>
</body>
</html>