dat-gui: A Lightweight GUI for JavaScript Variables

November 19th, 2012 by Adrian

dat-gui

Recently I’ve started using this really cool lightweight GUI for allowing the easy tweaking of your JavaScript variables at runtime. It’s called dat-gui and it is available for download from the Chrome experiments website. The source code is hosted on Google Code and there is a handy tutorial showing how to use it here.

It makes it really easy to display sliders, colour pickers, checkboxes, buttons, drop-down menus etc in a nice clean panel (that can also be hidden) that update your JavaScript variables on-the-fly. It is also possible to create presets and save bespoke settings.

The interface looks something like this …

dat-gui Example

Here is my example of it in use.

Canvas Experiment 22

Posted in Canvas, Javascript | No Comments »

Leave a Comment

Please note: Comment moderation is enabled and may delay your comment. There is no need to resubmit your comment.