みなさんは、上の画像みたいにパラメータをいじれるGUIを見たことがあるでしょうか? いろいろネットを検索していると、たまに見かけたりするのですが、だいたい3D系のサンプルデモや物理演算のシミュレーションなどによく使われているようです。 実際に触ってみると意外に便利なライブラリで、プログラムの好きな箇所をGUIで表示させて、誰でも気軽にいじれるようにできるのは面白いと思います。 そこで今回は、この「dat.gui」の簡単な使い方などをまとめておきたいと思います。 使い方! まず、簡単なサンプルデモを作りながら、基本的な使い方を見ていくことにします。 今回は、「div要素」で四角のボックスを作り、これにCSSをGUIからコントロールしてみようと思います。 サンプルデモはこんな感じ!(スマホ対応してないので、できればPCブラウザ推奨です…) See the Pen http://codepen.
![プログラムの中身を直感的なGUIで操作できるJavaScriptライブラリ「dat.gui」を使ってみた! : うえぶはっく](https://cdn-ak-scissors.b.st-hatena.com/image/square/4c27050ca668a4cf6c493b6b0d9f3834c67e4867/height=288;version=1;width=512/https%3A%2F%2Flivedoor.blogimg.jp%2Fhackforweb%2Fimgs%2F6%2F0%2F60a44f49.jpg)