Pure Knob

Overview

The pure-knob is a versatile and interactive control element designed with simplicity in mind. This circular knob/dial offers a user-friendly interface for adjusting values through various input methods, including mouse, wheel, touch, and keyboard. Implemented entirely in pure JavaScript, it allows for seamless integration into web applications without the need for image files, ensuring that your interface remains clean and lightweight.

In addition to its knob functionality, the pure-knob can also generate linear bar graphs, making it a handy tool for visual data representation. Its customizable features empower developers to tailor the knob to their specific needs, providing flexibility and enhancing the overall user experience.

Features

• Multi-Input Support: Operate the knob using mouse, wheel, touch, or keyboard for a versatile user experience.

• Customizable Angles: Set the start and end angles in radians to define the knob's track orientation.

• Color Options: Personalize the knob with background, foreground, and label colors to match your application’s design.

• Labeling Functionality: Add an optional label displayed along the bottom of the knob, enhancing clarity and user interaction.

• Read-Only Mode: Enable a read-only mode to display values without allowing user edits, perfect for static data representation.

• Dynamic Scaling: Adjust font size linearly with the textScale feature for improved visibility and aesthetics.

• Value Constraints: Set minimum and maximum selectable values for precise control and user guidance.

• Custom Formatting Functions: Integrate custom JavaScript functions for advanced formatting of displayed values, accommodating unique number representations.