sm annotate

Outil d'annotation vidéo et image

Ce projet fournit un outil d'annotation pour les éléments vidéo et d'image HTML. L'outil permet aux utilisateurs de dessiner et d'annoter sur la vidéo et les images en utilisant divers outils de dessin, y compris les courbes, les rectangles, les ellipses et les textes. Les utilisateurs peuvent également personnaliser la taille de la couleur et de la course de leurs annotations.

Demo: lifeart.github.io/sm-annotate

Caractéristiques

• Dessin et anotation sur les éléments vidéo et image.
• Plusieurs outils de dessin (courbe, rectangle, ellipse et texte).
• Couleur personnalisable et taille de course pour les annotations.
• ↩ Annuler la fonctionnalité.
• Sérialisation et désérialisation des formes dessinées.
• Échelle des formes à la taille actuelle de la toile.
• ⌨ Raccourcis clavier pour l'annulation (Ctrl / CMD + Z).
• Gestion des événements pour les événements de pointeur (souris et toucher).
• Playage des cadres annotés comme vidéo.
• Enregistrer le cadre actuel ou toutes les cadres avec annotations.
• Comparsion de superposition vidéo

Avantages supplémentaires

• Zéro dépendances.
• Prise en charge des appareils mobiles.
• Système de plugin puissant.
• Écrit en dactylographie.

Commencer

Ajoutez le package à votre projet à l'aide du fil:

yarn add https://github.com/lifeart/sm-annotate.git

Usage

 import { SmAnnotate } from '@lifeart/sm-annotate' ;
const video = document . getElementById ( 'video' ) ;
const annotationTool = new AnnotationTool ( video ) ;

Les utilisateurs peuvent dessiner et annoter à l'aide des outils disponibles (courbe, rectangle, ellipse et texte) et personnaliser la taille de la couleur et de la course des annotations. L'outil prend également en charge les fonctionnalités d'annulation et la gestion des événements pour les événements de pointeur (souris et toucher).

Pour enregistrer le cadre actuel ou toutes les cadres avec des annotations, utilisez respectivement les méthodes saveCurrentFrame ou saveAllFrames .

Lourdeur

Outil de courbe

Keycode	Résultat
Shift	Magnifique x2
r	Couleur rouge
g	Couleur verte
b	Couleur bleue
y	Couleur jaune
1 - 9	Taille de l'outil

Contributif

Nous accueillons des contributions pour améliorer le projet. N'hésitez pas à soumettre des problèmes ou à réaliser des demandes de considération.

Licence

Ce code est autorisé pour une utilisation non commerciale. Pour une utilisation commerciale, les utilisateurs doivent contacter l'auteur.