@seluna/photo-collage

photo-collage

Combines several images into a photo collage.

Usage

create method

import { Collage, Options } from '@seluna/photo-collage';

const sources: (Buffer | Canvas | string)[] = [
  fs.readFileSync(path.resolve(`images/1.jpg`)), // Buffer
  canvasImage, // Canvas
  'https://example.com/img.jpg', // Link to image
  path.resolve(`images/img.jpg`), // Local file
];

const options: Options = {
  width: 2, // Images per row
  height: 2, // Images per column
  imageWidth: 300, // Width of input images
  imageHeight: 300, // Height of input images
  spacing: 0, // Optional: Pixel spacing between images
  // Background in this case takes a Buffer, Canvas, file path, or link to an image
  background: fs.readFileSync(path.resolve('images/background.png')),
};

const collage = await Collage.create(sources, options);

createFromBuffers method

import { Collage, BufferOptions } from '@seluna/photo-collage';

// createFromBuffers exclusively takes images as buffers
const sources: Buffer[] = [
  fs.readFileSync(path.resolve(`images/1.jpg`)),
  fs.readFileSync(path.resolve(`images/2.jpg`)),
  fs.readFileSync(path.resolve(`images/3.jpg`)),
  fs.readFileSync(path.resolve(`images/4.jpg`)),
];

const options: BufferOptions = {
  width: 2, // Images per row
  height: 2, // Images per column
  imageWidth: 300, // Width of input images
  imageHeight: 300, // Height of input images
  spacing: 0, // Optional: Pixel spacing between images
  background: fs.readFileSync(path.resolve('images/background.png')), // Background in this case only takes a Buffer
};

const collage = Collage.createFromBuffers(sources, options);