Au début, je voulais juste écrire une simple planche à dessin. Plus tard, je me suis souvenu inconsciemment que les documents graphite avaient une fonction de tableau blanc, j'ai donc voulu développer la fonction de canevas actuelle en une version simplifiée de la planche à dessin collaborative.
Démo en ligne : actuellement en cours de déploiement, il doit être cloné pour fonctionner localement.
adresse git
2. Courez
git clone <repository>npm install#>>>>Pour la phase de développement : #Démarrage du service front-end (à l'aide du serveur de développement webpack) : npm run dev#Démarrage du service backend (nodemon est utilisé pour surveiller les modifications des fichiers back-end en temps réel time et redémarrez le service) npm run start# >>>Pour la phase de production : #Emballez les fichiers frontaux, puis démarrez le serveur 1. npm run build2.
3. Fonction :
Développement terminé :
• Zoom sur la toile (terminé)
• Couleur de la toile (Terminé)
• Couleur du pinceau (terminé)
• Épaisseur du pinceau (Terminé)
• Historique (annuler, restaurer) (Terminé)
•Salle de discussion (Terminé)
• Collaboration Draw (similaire à la collaboration sur des documents graphite) (Terminé)
Fonctionnalités à développer :•Embellissement de l'interface utilisateur (à développer) •Planification de l'utilisation de la bibliothèque UI (conception matérielle)
•Contrôle de texte (à développer)
• Téléchargez des images et dessinez à partir d'images (à développer)
•La forme de base du dessin peut être glissée pour ajuster la taille (à développer)
• Fonctions de chat riches (expressions, images, audio et vidéo) (à développer) • webRTC obtient les données du flux vidéo et les transmet
•Autres fonctions inconnues (x)
4. Dessin d'effet
5. Postface
La mise en œuvre de cette application est relativement basique et il reste encore beaucoup à faire.
Ce qui précède est la fonction de planche à dessin partagée implémentée par socket.io et canvas introduite par l'éditeur. J'espère qu'elle vous sera utile. Si vous avez des questions, veuillez me laisser un message et l'éditeur vous répondra à temps !