Soy un diseñador gráfico al que le gustaría crear una aplicación que tome activos gráficos y cree gráficos combinados con los activos.
Ejemplo: tengo 3 cabezas, 3 cuerpos y 3 armas de un monstruo y me gustaría crear todas las combinaciones posibles, multiplicar por combinaciones de colores y exportar a archivos PNG o GIF.
Llevo un tiempo aprendiendo JS y quería crear este tipo de aplicación en Electron, pero me cuesta encontrar los recursos de aprendizaje sobre el procesamiento de imágenes en JS. Miré aquí en la pila, pero muchas preguntas similares son de ~ 2009 y hacen referencia a documentos de MDN que no existen.
¿Podría sugerirme una dirección? Encontré algunos tutoriales sobre el procesamiento de lienzo HTML, pero en su mayoría aplicaron filtros en JPG.
echa un vistazo a esta biblioteca: html2canvas
simplemente seleccione el contenedor de su combinación y hará el trabajo.
html2canvas(document.body).then(function(canvas) { var image = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream"); });