1.0.10 • Published 1 year ago
radial-control v1.0.10
Interactive Radial Control
Description: A UI wheel that displays the angle in degrees as it is rotated and fires a custom event containing the same angle in radians
Example
const controlWheel = ControlWheel({
circleThick: 5, // thickness of wheel in pixels
padding: 10, // Extra canvas area around the wheel
radius: 100, // Wheel radius in pixels
backGroundColor: "white", // Optional: Color of the canvas
continuous: true, // Optional: if true, rotate event fires continuously as wheel moves
});
Listen for wheel move "CONTROL_WHEEL_ROTATE" event to get angle Javascript
document.addEventListener("CONTROL_WHEEL_ROTATE", (ev) => {
const angleInRadians = ev.detail; // ev.detail contains the angle in radians
});
Typescript
document.addEventListener("CONTROL_WHEEL_ROTATE", (ev) => {
const angleInRadians = (<CustomEvent>ev).detail;
});
Dependencies Production dependencies - None
Installing To run project locally 1. npm Install 2. npm start Author Jacob Searles
Version History 0.1
License This project is licensed under the MIT License