ColorWheel

ESModule for rendering color wheels

Basically, I hate that browsers have different color pickers on different OSes.

Take a look at the demo code: demo 0

Take a look at the output: demo 0 - visual

demo 1 - visual

Usage is fairly simple:

Creating the wheel

let myWheel = new ColorWheel()

Adding & removing colors

let red = WheelColor.fromRGB(255, 0, 0);
myWheel.addColor(red);
myWheel.removeColor(red);

Appending it to the dom

myWheel.mount( myDiv );
//mount accepts an html or Component class (see component.js)

//Similar to
div.appendChild ( myWheel.element )

Helper functions that make life easy

  //Handle window resizing
  .handleResize()

  //Auto render when state changes
  .handleRedrawLoop()

  //Applies 100% to width and height of canvas element
  .fillParentSize();

Color picking

  .handleColorPicking()
  .on("color-pick", (color)=>{
    container.style["border-color"] = `rgb(${color.toString()})`;
  })