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