|
|
| Linha 98: |
Linha 98: |
|
| |
|
| slider(); | | slider(); |
|
| |
|
| |
| const img = document.getElementById('source-image');
| |
| const canvas = document.getElementById('canvas');
| |
| const ctx = canvas.getContext('2d');
| |
|
| |
| img.onload = function() {
| |
| // Desenhar a imagem no canvas para análise
| |
| canvas.width = img.width;
| |
| canvas.height = img.height;
| |
| ctx.drawImage(img, 0, 0);
| |
|
| |
| const imageData = ctx.getImageData(0, 0, img.width, img.height);
| |
| const pixels = imageData.data;
| |
|
| |
| let top = img.height, left = img.width, right = 0, bottom = 0;
| |
|
| |
| // Iterar pelos pixels para encontrar bordas do conteúdo
| |
| for (let y = 0; y < img.height; y++) {
| |
| for (let x = 0; x < img.width; x++) {
| |
| const i = (y * img.width + x) * 4;
| |
| const alpha = pixels[i + 3];
| |
|
| |
| if (alpha > 0) { // Pixel não é transparente
| |
| if (x < left) left = x;
| |
| if (x > right) right = x;
| |
| if (y < top) top = y;
| |
| if (y > bottom) bottom = y;
| |
| }
| |
| }
| |
| }
| |
|
| |
| // Calcular a largura e altura do conteúdo visível
| |
| const width = right - left;
| |
| const height = bottom - top;
| |
|
| |
| // Redimensionar o canvas e redesenhar o conteúdo cortado
| |
| canvas.width = width;
| |
| canvas.height = height;
| |
| ctx.clearRect(0, 0, canvas.width, canvas.height);
| |
| ctx.drawImage(img, left, top, width, height, 0, 0, width, height);
| |
| };
| |