Soy nuevo en el procesamiento de imágenes. Encontré el paquete "gpu.js" y parece ser muy poderoso para cualquier tipo de operación de imágenes en el navegador, pero no hay mucha información en Google al respecto y no entiendo cómo usarlo correctamente.
Lo que estoy tratando de hacer ahora: dibujé un lienzo con un fondo negro (0,0,0). También superpuse algunos píxeles de diferentes colores. Quiero obtener las coordenadas (x, y) de todos los píxeles RGB exactos en el lienzo, pero estoy atascado en esto y ni siquiera veo si es posible.
El código para el lienzo:
const draw = async () => { const canvas = document.createElement('canvas'); canvas.width = window.innerWidth; canvas.height = window.innerHeight; canvas.style.backgroundColor = 'rgb(0,0,0)' document.body.appendChild(canvas); const ctx = canvas.getContext('2d'); ctx.fillStyle = "rgb(234,0,255)"; ctx.fillRect(100,100,1,1); ctx.fillStyle = "rgb(0,0,255)"; ctx.fillRect(600,600,1,1); ctx.fillStyle = "rgb(0,255,0)"; ctx.fillRect(600,450,1,1); ctx.fillStyle = "rgb(0,254,253)"; ctx.fillRect(230,230,1,1); ctx.fillStyle = "rgb(140,8,9)"; ctx.fillRect(230,118,1,1); } draw(); const gpu = new GPU({mode: "gpu"}); * { margin: 0; padding: 0; } <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"/> <title>GPU</title> <script src="https://cdn.jsdelivr.net/npm/gpu.js@latest/dist/gpu-browser.min.js"></script> <style> </style> </head> <body> </body> </html> Por ejemplo, me gustaría encontrar coordenadas de píxeles con colores rgb(234,0,255) y rgb(140,8,9)
¿Qué debo hacer para lograrlo?