Example of Default Functionalities in React Image Editor Component

/
/
Default

This sample demonstrates Image Editor features such as crop, rotate, flip, insert shape and text.

More Details...

Loading....
Description

The Image Editor component provides built-in support to edit images in the following ways through APIs:

  • Selection : Multiple selection options are available. The selection region can be a square or circle, customized to various aspects ratios, and customized by dragging and resizing.
  • Crop : The image can be cropped based on the selection.
  • Rotate : The image can be rotated both clockwise and anticlockwise by 90 degrees.
  • Flip : The image can be flipped both horizontally and vertically.
  • Zoom : The image can be zoomed in and out.
  • Pan : View the entire image by toggling the pan option from the toolbar.
  • Freehand drawing : Draw freehand on the image and adjust the pen's stroke width and stroke color.
  • Reset : Revert all the edited states and load the original image.
  • Save : Save the edited image in JPEG, PNG, and SVG formats.
  • Annotation : Text, rectangle, ellipse, and line annotation shapes are supported.
  • Z-Order : Adjust the positioning of annotations to manage the layering of elements, essential for creating polished designs.

More information about Image Editor can be found in this documentation section.