Syncfusion React Image Editor

SyncfusionHerramientas de documentos e imágenesJavaScript

Un componente React integral para la edición y anotación avanzadas de imágenes.

  • Admite recorte, giro, volteo, zoom y aplicación de filtros.
  • Permite anotaciones con formas, texto y dibujo a mano alzada.
  • Exporta imágenes en formatos JPEG, PNG y SVG con una barra de herramientas personalizable.
Syncfusion logo

Precios desde:

Cargando...
Disponible en
Syncfusion Essential Studio UI Component SuiteCargando
Syncfusion Essential Studio EnterpriseCargando
imagen del producto Syncfusion React Image Editor
Syncfusion React Image Editor es un componente repleto de funciones que permite la visualización, edición y anotación de imágenes directamente dentro de aplicaciones web. Admite tareas comunes de manipulación de imágenes como recortar, cambiar el tamaño, girar y dibujar, lo que ayuda a los desarrolladores a integrar la edición interactiva de imágenes en sus aplicaciones.

Carga y guardado de imágenes

Abre imágenes desde base64, ImageData o URLs, admitiendo formatos PNG, JPEG y SVG. Guarda imágenes editadas en múltiples formatos con control sobre los nombres de archivo y la calidad.

Selección y recorte de imágenes

Selecciona regiones de la imagen usando opciones personalizadas, cuadradas, circulares o de relación de aspecto predefinida. Recorta imágenes de forma eficaz arrastrando y redimensionando las áreas de selección.

Transformación de imágenes

Gira imágenes en sentido horario o antihorario en incrementos de 90 grados y voltea imágenes horizontal o verticalmente, incluidas todas las anotaciones aplicadas.

Compatibilidad con anotaciones

Añade texto, formas (rectángulos, elipses, líneas), dibujos a mano alzada, superposiciones de imágenes, rutas y flechas. Personaliza el color, el ancho del trazo, las propiedades de la fuente y la posición.

Funcionalidad de zoom y desplazamiento

Ajusta la escala y la posición de la imagen con zoom mediante teclado, rueda del ratón o gestos táctiles. Desplázate para ver distintas áreas de la imagen de forma dinámica.

Personalización de la barra de herramientas

Modifica la barra de herramientas integrada añadiendo, eliminando o reemplazando elementos con plantillas jsx personalizadas para adaptar la interfaz de usuario a necesidades específicas.

Filtros de imagen y ajustes finos

Aplica filtros predefinidos como sepia, escala de grises, invertir, cálido y frío. Ajusta con precisión propiedades de la imagen como brillo, contraste, exposición, tono, saturación, opacidad y desenfoque mediante la interfaz de usuario o APIs.

Interfaz adaptable y táctil

El componente se adapta automáticamente a distintos tamaños de pantalla y tipos de entrada, ofreciendo una experiencia fluida en equipos de escritorio, tablets y dispositivos móviles.

Gestión del orden Z para anotaciones

Controla la superposición de las anotaciones para gestionar el solapamiento y la visibilidad, algo esencial para crear composiciones de imágenes complejas.

APIs y temas pensados para desarrolladores

Ofrece amplias APIs para el control mediante programación y admite varios temas integrados con opciones de tematización personalizada mediante variables SASS o Theme Studio.

Compatibilidad del producto

Revise los detalles a continuación para asegurarse de que este producto sea compatible con su entorno.

Tipo de componente

  • JavaScript

Plataforma JavaScript

  • React