Question

Is there any way to get a color picker which modified the alpha channel of a RGBA color using dat.gui ( http://code.google.com/p/dat-gui/ )?

Currently I'm only able to change the RGB value using the color picker - even though the color picker accepts an alpha value.

Example (also available http://jsfiddle.net/mortennobel/PT3g2/1/ ):

var ColorObject = function() {
   this.color = [ 0, 128, 255, 0.3 ]; // RGB with alpha
    this.showAlert = function(){
        alert("Color is "+this.color);
    } 
};

var colorObject = new ColorObject();
var gui = new dat.GUI();

gui.addColor(colorObject, 'color');
gui.add(colorObject, 'showAlert');  
Was it helpful?

Solution

I'm not sure if there's any easy way to extend existing library. I've just made changes to library itself. You can try it here: http://jsbin.com/anewaz/2

Modified sources are also on my github: https://github.com/mariozski/datGUIwithAlpha/blob/master/dat.gui.js

Hope it'll help :-)

mz

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top