7 Repos
Tracking the real-time X and Y coordinates of multiple elements to manage motion and interaction.
Distinct from Coordinate-Based Position Calculators: Focuses on maintaining a state array of moving object coordinates rather than calculating static insertion points for UI components
Explore 7 awesome GitHub repositories matching user interface & experience · Spatial State Tracking. Refine with filters or upvote what's useful.
particles.js is a JavaScript particle animation library and visual effects engine used to create interactive, canvas-based simulations for web interfaces. It enables the generation of dynamic background animations and networked visual effects through coordinate-based particle movements. The library features a system for drawing connecting lines between particles based on proximity to create network-style visualizations. It includes mechanisms for mapping mouse movements and click events to specific particle behaviors, such as attraction or repulsion. Users can configure particle density, opa
Maintains an internal state of particle coordinates to calculate and update movement in every animation frame.
interact.js ist eine JavaScript-Interaktionsbibliothek, die verwendet wird, um Drag-and-Drop, Größenänderung und Multi-Touch-Gesten in Webbrowsern zu implementieren. Sie bietet ein spezialisiertes Interaktions-Framework für skalierbare Vektorgrafiken, das es ermöglicht, diese Elemente zu verschieben und in der Größe zu ändern. Die Bibliothek verfügt über eine Multi-Touch-Gesten-Engine, die komplexe Muster wie Pinch und Rotate erkennt, sowie eine Koordinaten-Snapping-Engine zum Ausrichten von Elementen an Rastern oder zum Einschränken von Bewegungen innerhalb von Grenzen. Sie enthält zudem einen Cross-Frame-Zustandssynchronisierer, um Interaktionszustände und Eingabeereignisse über mehrere Browserfenster oder eingebettete Frames hinweg zu teilen. Das Projekt deckt breite Fähigkeitsbereiche ab, einschließlich Bewegungsphysik für trägheitsbasierte Geschwindigkeitsberechnungen und Eingabenormalisierung zur Vereinheitlichung von Maus- und Touch-Ereignissen über Browser hinweg. Zusätzliche Funktionen umfassen die koordinatenbasierte Zustandsverfolgung und quantisiertes Snapping, um Positionen und Größen an vordefinierte Intervalle anzupassen.
Tracks real-time X and Y coordinates of elements to maintain an accurate internal state of position and size.
Raphael is a JavaScript library for creating, manipulating, and animating scalable vector graphics. It provides a programmatic interface and a cross-browser renderer for drawing 2D vector graphics and complex shapes within a web browser. The project functions as an SVG animation framework and drawing API, allowing for the construction of diagrams, charts, and custom illustrations. It enables the creation of motion graphics through the transformation of vector elements using coordinate systems and easing functions. The library covers capabilities for scalable vector rendering, dynamic data vi
Maintains a real-time state array of graphical object coordinates to enable dynamic visual updates.
Isotope is a JavaScript grid layout library used to create filterable and sortable grids with automatic element positioning in the browser. It functions as a layout engine that calculates absolute coordinates for elements to maintain a dense grid regardless of individual item dimensions. The library features a masonry layout engine that arranges items of varying heights into a compact grid to eliminate vertical gaps. It includes a coordinate-based layout animator for smooth transitions during layout shifts and a CSS selector filtering tool to show or hide elements without reloading the page.
Tracks the real-time X and Y coordinates of DOM elements to manage layout state and motion.
This is an Android pull-to-refresh library and custom view component designed to implement refresh interactions across any Android view. It functions as a gesture interaction tool that manages pull-down motions and touch conflicts to trigger data loading operations. The library provides tools for creating custom refresh headers and indicator visuals, utilizing a path-based animation engine to produce non-linear visual transitions. It includes mechanisms to define specific trigger thresholds through height ratios and user release events. The project covers gesture management and touch interac
Implements spatial state tracking of vertical offsets and velocity to manage the motion of the refresh header.
tracking.js is a browser computer vision library written in JavaScript for performing real-time image analysis and object tracking directly within a web browser. It functions as a real-time object tracker, a color tracking tool, and a face detection utility. The library enables the detection and monitoring of specific color ranges, human faces, and known visual patterns across consecutive video frames. It extracts visual features and descriptors from images to identify distinct landmarks for matching and tracking. The project covers broad computer vision capabilities, including the ability t
Calculates geometric centers and boundaries of visual blobs to maintain target identity across frames.
react-draggable is a UI interaction library that provides core primitives and components for adding tactile movement and coordinate-based positioning to web elements. It serves as a tool for making user interface elements movable via mouse or touch interactions within React applications. The library supports the implementation of custom drag handles, allowing the initiation of movement to be restricted to specific child elements identified by CSS selectors. It also provides programmatic drag state management, enabling developers to control element positioning or use callbacks for movement wit
Tracks real-time mouse and touch coordinates to maintain the spatial state of moving elements.