Transformations

Crop and resize images in the browser with quality controls.

Crop

Extract a rectangular region from the image.

editor.crop({
  x: number,      // Left position (required)
  y: number,      // Top position (required)
  width: number,  // Crop width (required)
  height: number  // Crop height (required)
});

// Example: Crop a 300x300 region starting at position (50, 50)
editor.crop({ x: 50, y: 50, width: 300, height: 300 });

Resize

Scale the image to new dimensions.

editor.resize(
  width: number,   // Target width (required)
  height: number,  // Target height (required)
  options?: {
    quality?: 'low' | 'medium' | 'high',  // Default: 'medium'
    maintainAspectRatio?: boolean          // Default: false
  }
);

// Examples
editor.resize(800, 600);

// High-quality resize maintaining aspect ratio
editor.resize(800, 600, {
  quality: 'high',
  maintainAspectRatio: true
});

Quality Levels