Syncfusion React Image Editor

SyncfusionFerramentas de Documentos e ImagensJavaScript

Um componente React abrangente para edição avançada de imagens e anotação.

  • Suporta recorte, rotação, espelhamento, zoom e aplicação de filtros.
  • Permite anotações com formas, texto e desenho à mão livre.
  • Exporta imagens nos formatos JPEG, PNG e SVG com barra de ferramentas personalizável.
Syncfusion logo

Preços a partir de:

Carregando...
Disponível em
Syncfusion Essential Studio UI Component SuiteCarregando
Syncfusion Essential Studio EnterpriseCarregando
imagem do produto Syncfusion React Image Editor
O Syncfusion React Image Editor é um componente rico em recursos que permite visualização, edição e anotação de imagens diretamente em aplicativos web. Ele oferece suporte a tarefas comuns de manipulação de imagens, como recorte, redimensionamento, rotação e desenho, ajudando os desenvolvedores a incorporar edição interativa de imagens em seus apps.

Carregamento e Salvamento de Imagens

Abra imagens a partir de base64, ImageData ou URLs, com suporte aos formatos PNG, JPEG e SVG. Salve imagens editadas em vários formatos com controle sobre nomes de arquivo e qualidade.

Seleção e Recorte de Imagens

Selecione regiões da imagem usando opções personalizadas, quadradas, circulares ou de proporção predefinida. Recorte imagens de forma eficaz arrastando e redimensionando áreas de seleção.

Transformação de Imagem

Gire imagens no sentido horário ou anti-horário em incrementos de 90 graus e espelhe imagens horizontalmente ou verticalmente, incluindo todas as anotações aplicadas.

Suporte a Anotações

Adicione texto, formas (retângulos, elipses, linhas), desenhos à mão livre, sobreposições de imagem, caminhos e setas. Personalize cor, largura do traço, propriedades da fonte e posicionamento.

Funcionalidade de Zoom e Pan

Ajuste a escala e a posição da imagem com zoom usando teclado, roda do mouse ou gestos de toque. Faça pan para visualizar diferentes áreas da imagem dinamicamente.

Personalização da Barra de Ferramentas

Modifique a barra de ferramentas integrada adicionando, removendo ou substituindo itens com templates jsx personalizados para adaptar a interface do usuário a necessidades específicas.

Filtros de Imagem e Ajuste Fino

Aplique filtros predefinidos como sépia, escala de cinza, inverter, quente e frio. Ajuste finamente propriedades da imagem, incluindo brilho, contraste, exposição, matiz, saturação, opacidade e desfoque por meio da UI ou de APIs.

Interface Responsiva e Compatível com Toque

O componente se adapta automaticamente a vários tamanhos de tela e tipos de entrada, oferecendo uma experiência fluida em desktops, tablets e dispositivos móveis.

Gerenciamento de Ordem Z para Anotações

Controle o empilhamento das anotações para gerenciar sobreposição e visibilidade, essencial para criar composições de imagem complexas.

APIs e Temas Voltados para Desenvolvedores

Oferece APIs extensas para controle programático e suporta vários temas integrados, com opções de tema personalizado usando variáveis SASS ou o Theme Studio.

Compatibilidade do produto

Revise os detalhes abaixo para garantir que este produto seja compatível com o seu ambiente.

Tipo de componente

  • JavaScript

Plataforma JavaScript

  • React