# radial-control

> A rotational user control

Latest version **1.0.10** (published 2023-03-13) · ISC license · 0 weekly downloads

## Install

```sh
npm install radial-control
pnpm add radial-control
yarn add radial-control
bun add radial-control
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.10 |
| Published | 2023-03-13 |
| First published | 2023-03-08 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 5.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | jacobsearles |

## Links

- npm: https://www.npmjs.com/package/radial-control
- npm.io page: https://npm.io/package/radial-control

## Recent versions

- 1.0.10 (latest) — 2023-03-13
- 1.0.8 — 2023-03-13
- 1.0.7 — 2023-03-12
- 1.0.6 — 2023-03-12
- 1.0.5 — 2023-03-12
- 1.0.4 — 2023-03-12
- 1.0.3 — 2023-03-12
- 1.0.2 — 2023-03-12
- 1.0.1 — 2023-03-11
- 1.0.0 — 2023-03-08

## README

## Interactive Radial Control

![radial degree control](./screen.jpg?raw=true)

Description:<br>
A UI wheel that displays the angle in degrees as it is rotated and fires a custom event containing the same angle in radians<br>
<br>

Example<br>

```javascript
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<br>
Javascript

```javascript
document.addEventListener("CONTROL_WHEEL_ROTATE", (ev) => {
  const angleInRadians = ev.detail; // ev.detail contains the angle in radians
});
````

Typescript<br>

```typescript
document.addEventListener("CONTROL_WHEEL_ROTATE", (ev) => {
  const angleInRadians = (<CustomEvent>ev).detail;
});
```

Dependencies <br>
Production dependencies - None

Installing
To run project locally <br> 1. npm Install <br> 2. npm start<br>
<br>
Author <br>
Jacob Searles

Version History<br>
0.1

License<br>
This project is licensed under the MIT License

---
_Source: https://npm.io/package/radial-control · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._