7 个仓库
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 是一个 JavaScript 交互库,用于在 Web 浏览器中实现拖放、调整大小和多点触控手势。它为可缩放矢量图形(SVG)提供了一个专门的交互框架,允许移动和调整这些元素的大小。 该库具有一个多点触控手势引擎,可识别捏合和旋转等复杂模式,以及一个用于将元素对齐到网格或限制在边界内移动的坐标吸附引擎。它还包括一个跨帧状态同步器,用于在多个浏览器窗口或嵌入式帧之间共享交互状态和输入事件。 该项目涵盖了广泛的能力领域,包括用于基于惯性的速度计算的运动物理学,以及用于统一跨浏览器鼠标和触摸事件的输入归一化。附加功能包括基于坐标的状态跟踪和用于将位置和大小对齐到预定义间隔的量化吸附。
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.