How to use the vis-util.RGBToHSV function in vis-util

To help you get started, we’ve selected a few vis-util examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github visjs / vis-network / lib / shared / ColorPicker.js View on Github external
_updatePicker(rgba = this.color) {
    let hsv = util.RGBToHSV(rgba.r, rgba.g, rgba.b);
    let ctx = this.colorPickerCanvas.getContext('2d');
    if (this.pixelRation === undefined) {
      this.pixelRatio = (window.devicePixelRatio || 1) / (ctx.webkitBackingStorePixelRatio ||
      ctx.mozBackingStorePixelRatio ||
      ctx.msBackingStorePixelRatio ||
      ctx.oBackingStorePixelRatio ||
      ctx.backingStorePixelRatio || 1);
    }
    ctx.setTransform(this.pixelRatio, 0, 0, this.pixelRatio, 0, 0);

    // clear the canvas
    let w = this.colorPickerCanvas.clientWidth;
    let h = this.colorPickerCanvas.clientHeight;
    ctx.clearRect(0, 0, w, h);

    ctx.putImageData(this.hueCircle, 0,0);
github visjs / vis-network / lib / shared / ColorPicker.js View on Github external
_setColor(rgba, setInitial = true) {
    // store the initial color
    if (setInitial === true) {
      this.initialColor = util.extend({}, rgba);
    }

    this.color = rgba;
    let hsv = util.RGBToHSV(rgba.r, rgba.g, rgba.b);

    let angleConvert = 2 * Math.PI;
    let radius = this.r * hsv.s;
    let x = this.centerCoordinates.x + radius * Math.sin(angleConvert * hsv.h);
    let y = this.centerCoordinates.y + radius * Math.cos(angleConvert * hsv.h);

    this.colorPickerSelector.style.left = x - 0.5 * this.colorPickerSelector.clientWidth + 'px';
    this.colorPickerSelector.style.top = y - 0.5 * this.colorPickerSelector.clientHeight + 'px';

    this._updatePicker(rgba);
  }
github visjs / vis-network / lib / shared / ColorPicker.js View on Github external
let y = top - centerY;

    let angle = Math.atan2(x,y);
    let radius = 0.98 * Math.min(Math.sqrt(x * x + y * y), centerX);

    let newTop = Math.cos(angle) * radius + centerY;
    let newLeft = Math.sin(angle) * radius + centerX;

    this.colorPickerSelector.style.top = newTop - 0.5 * this.colorPickerSelector.clientHeight + 'px';
    this.colorPickerSelector.style.left = newLeft - 0.5 * this.colorPickerSelector.clientWidth + 'px';

    // set color
    let h = angle / (2 * Math.PI);
    h = h < 0 ? h + 1 : h;
    let s = radius / this.r;
    let hsv = util.RGBToHSV(this.color.r, this.color.g, this.color.b);
    hsv.h = h;
    hsv.s = s;
    let rgba = util.HSVToRGB(hsv.h, hsv.s, hsv.v);
    rgba['a'] = this.color.a;
    this.color = rgba;

    // update previews
    this.initialColorDiv.style.backgroundColor = 'rgba(' + this.initialColor.r + ',' + this.initialColor.g + ',' + this.initialColor.b + ',' + this.initialColor.a + ')';
    this.newColorDiv.style.backgroundColor = 'rgba(' + this.color.r + ',' + this.color.g + ',' + this.color.b + ',' + this.color.a + ')';
  }
}
github visjs / vis-network / lib / shared / ColorPicker.js View on Github external
_setBrightness(value) {
    let hsv = util.RGBToHSV(this.color.r, this.color.g, this.color.b);
    hsv.v = value / 100;
    let rgba = util.HSVToRGB(hsv.h, hsv.s, hsv.v);
    rgba['a'] = this.color.a;
    this.color = rgba;
    this._updatePicker();
  }