Awesome GitHub RepositoriesBrowser-Based Image Processing

tui.image-editor is a JavaScript image manipulation library and web-based photo editor. It provides a browser-based interface for cropping, resizing, and applying filters to images using the HTML5 Canvas API. The project is distinguished by its role as a canvas-based annotation tool, allowing users to add text, shapes, and freehand drawings as graphic overlays. It offers extensive UI customization through theme configuration, interface text localization, and the ability to replace default icons with custom SVG files. The library covers geometry manipulation, visual filter application, and im

CSSgram est une bibliothèque et un framework de filtres d'image CSS qui fournit un système de mixins et de classes réutilisables pour implémenter des effets d'image visuels. Il permet le traitement d'image basé sur CSS pour modifier l'apparence des images directement dans le navigateur sans nécessiter de traitement côté serveur. Le projet facilite le traitement photo côté client et le stylisme visuel frontend en appliquant des filtres de style photographique et des préréglages de couleur aux images web. Il utilise une combinaison de filtres CSS et de modes de fusion pour obtenir ces effets via l'assignation de noms de classe prédéfinis aux éléments HTML.

Ce projet est un éditeur de design graphique et un créateur d'affiches en ligne basé sur le web. Il offre un environnement dans le navigateur pour créer des mises en page professionnelles, des graphismes e-commerce et des couvertures pour réseaux sociaux en utilisant un canevas avec des éléments en glisser-déposer. La boîte à outils inclut un convertisseur de modèles PSD spécialisé qui analyse les fichiers de design Photoshop en modèles web éditables. Elle propose également un générateur de QR codes personnalisé capable de produire des codes stylisés avec des dégradés et des logos intégrés, ainsi qu'un outil de manipulation d'image dans le navigateur pour recadrer des assets et supprimer des arrière-plans. L'éditeur couvre de larges capacités de design graphique, incluant la gestion des plans de travail et des calques, le formatage typographique avec effets CSS, et l'assistance à l'alignement spatial via des lignes de repère et des règles. Une sortie haute fidélité est obtenue grâce à un processus hybride de rendu frontend et côté serveur pour garantir une reproduction précise des images. Le système prend en charge la gestion de modèles utilisateur pour stocker et mettre à jour des mises en page personnalisées.

Il s'agit d'une bibliothèque de chargement d'images JavaScript et d'une suite d'utilitaires pour l'analyse des métadonnées binaires et les transformations basées sur canvas. Elle fournit une interface unifiée pour charger des images depuis des URL, des Blobs ou des fichiers dans des éléments HTML. La bibliothèque inclut un transformateur d'images basé sur canvas pour produire des images redimensionnées, recadrées ou pivotées et un gestionnaire d'orientation d'image qui fait pivoter ou retourne les images en fonction des métadonnées intégrées. Elle dispose également d'un analyseur de métadonnées Exif pour extraire les balises IPTC et Exif et les vignettes intégrées à partir des données d'image binaires. La boîte à outils couvre le traitement d'images basé sur le navigateur, y compris le redimensionnement côté client et la correction automatique de l'orientation pour garantir un affichage cohérent sur différents écrans. Elle prend en charge l'extraction et la modification des en-têtes binaires d'image et la restauration des métadonnées après le redimensionnement.

Pica est un utilitaire côté client pour la mise à l'échelle d'images, la transformation de format et l'optimisation de fichiers basée sur le navigateur. Il fonctionne comme un processeur d'image canvas qui transforme les données entre les éléments canvas, les bitmaps et les blobs pour une manipulation locale au sein du navigateur web. La bibliothèque se distingue par une réduction d'échelle de haute qualité utilisant le rééchantillonnage de Lanczos et un modèle de traitement multi-thread. Elle utilise des web workers pour diviser le traitement d'image en tuiles sur les cœurs du CPU afin d'augmenter la vitesse de redimensionnement. Le projet couvre un large éventail de capacités de manipulation d'image, incluant la mise à l'échelle de haute qualité et le filtrage de masque flou pour l'amélioration des bords. Il prend en charge plusieurs formats d'entrée et fournit des utilitaires pour exporter les données traitées dans des objets blob binaires. Pour gérer les grandes images sans provoquer de plantages du navigateur, la bibliothèque utilise une gestion de mémoire par blocs et un traitement par tuiles.

Ce projet est un éditeur graphique basé sur le navigateur et une bibliothèque de traitement d'image qui effectue des transformations visuelles directement au sein de l'environnement web. Il fournit une boîte à outils pour charger des fichiers image locaux, appliquer des effets visuels complexes et exporter les résultats modifiés sans nécessiter de traitement de données côté serveur. La bibliothèque utilise des shaders de fragment accélérés par le matériel pour exécuter des opérations au niveau des pixels sur l'unité de traitement graphique (GPU). En maintenant les données d'image sous forme de textures dans la mémoire GPU et en utilisant un pipeline de rendu en mode immédiat, le système atteint une synchronisation en temps réel entre les paramètres de filtre définis par l'utilisateur et la sortie visuelle affichée sur le canvas. Le logiciel prend en charge une gamme d'ajustements d'image, incluant la modification du contraste, les effets tilt-shift et la simulation de défocalisation d'objectif. Ces opérations sont traitées via une injection de paramètres pilotée par des uniformes, permettant une manipulation haute performance des fichiers multimédias numériques directement sur l'appareil de l'utilisateur.