Hay diferentes tamaños de imágenes en una carpeta, necesito combinarlas en una imagen grande. Estoy tratando de implementarlo con html5. ¿Alguna idea de cómo llenar todas las imágenes en un lienzo de ancho fijo (1980 px) sin escalar las imágenes?

Aquí están las condiciones:

• El ancho del lienzo es de 1980 px y la altura del lienzo debe aumentarse automáticamente, lo que depende de la cantidad y la altura de las imágenes.

• Las imágenes no se pueden escalar.

• Después de rellenar las imágenes, el espacio en blanco del lienzo debe ser el mínimo posible. Cada tamaño de imagen debe ser detectado y colocado en la posición correcta.

• La fusión mínima de cada imagen es de 5px.