example.html · kylong/dat.gui

代码拉取完成,页面将自动刷新

扫描微信二维码支付

取消

支付完成

richgiteeai

Watch

不关注关注所有动态仅关注版本发行动态关注但不提醒动态

1 Star 0 Fork 0

kylong/dat.gui

代码 Issues 0 Pull Requests 0 Wiki 统计流水线

服务

加入 Gitee

与超过 1400万开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)

免费加入

已有帐号? 立即登录

文件

master

分支 (6)

标签 (23)

管理

master

develop

gh-pages

polymer

playback

build

v0.7.7

v0.7.6

v0.7.5

v0.7.4

v0.7.3

v0.7.2

v0.7.1

v0.7.0

v0.7.0-0

v0.6.5

v0.6.4

v0.6.3

v0.6.2

0.6.1

v0.6.0

v0.5.1

v0.4.0

v0.5.0

v0.4

v0.2

克隆/下载

HTTPS SSH SVN SVN+SSH 下载ZIP

提示

下载代码请复制以下命令到终端执行

为确保你提交的代码身份被 Gitee 正确识别,请执行以下命令完成配置

git config --global user.name userName 
git config --global user.email userEmail

初次使用 SSH 协议进行代码克隆、推送等操作时,需按下述提示完成 SSH 配置

1 生成 RSA 密钥

2 获取 RSA 公钥内容,并配置到 SSH公钥中

在 Gitee 上使用 SVN,请访问使用指南

使用 HTTPS 协议时,命令行会出现如下账号密码验证步骤。基于安全考虑,Gitee 建议配置并使用私人令牌替代登录密码进行克隆、推送等操作

Username for 'https://gitee.com': userName

Password for 'https://userName@gitee.com': # 私人令牌

分支 6

标签 23

dat.gui

example.html

example.html 1.54 KB

<!DOCTYPE html>
<html>
<head>
 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
</head>
<body>
 <script type="text/javascript" src="build/dat.gui.js"></script>
 <script type="text/javascript">
 var obj = {
 message: 'Hello World',
 displayOutline: false,

maxSize: 6.0,
 speed: 5,

height: 10,
 noiseStrength: 10.2,
 growthSpeed: 0.2,

type: 'three',

explode: function () {
 alert('Bang!');
 },

color0: "#ffae23", // CSS string
 color1: [ 0, 128, 255 ], // RGB array
 color2: [ 0, 128, 255, 0.3 ], // RGB with alpha
 color3: { h: 350, s: 0.9, v: 0.3 } // Hue, saturation, value
 };

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

gui.remember(obj);

gui.add(obj, 'message');
 gui.add(obj, 'displayOutline');
 gui.add(obj, 'explode');

gui.add(obj, 'maxSize').min(-10).max(10).step(0.25);
 gui.add(obj, 'height').step(5); // Increment amount

// Choose from accepted values
 gui.add(obj, 'type', [ 'one', 'two', 'three' ] );

// Choose from named values
 gui.add(obj, 'speed', { Stopped: 0, Slow: 0.1, Fast: 5 } );

var f1 = gui.addFolder('Colors');
 f1.addColor(obj, 'color0');
 f1.addColor(obj, 'color1');
 f1.addColor(obj, 'color2');
 f1.addColor(obj, 'color3');

var f2 = gui.addFolder('Another Folder');
 f2.add(obj, 'noiseStrength');

var f3 = f2.addFolder('Nested Folder');
 f3.add(obj, 'growthSpeed');

</script>
</body>
</html>

一键复制编辑原始数据按行查看历史

Don McCurdy 提交于 2018年01月21日 13:09 +08:00 . Add tag for testing example on mobile devices.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63

<!DOCTYPE html>
<html>
<head>
 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
</head>
<body>
 <script type="text/javascript" src="build/dat.gui.js"></script>
 <script type="text/javascript">
 var obj = {
 message: 'Hello World',
 displayOutline: false,

 maxSize: 6.0,
 speed: 5,

 height: 10,
 noiseStrength: 10.2,
 growthSpeed: 0.2,

 type: 'three',

 explode: function () {
 alert('Bang!');
 },

 color0: "#ffae23", // CSS string
 color1: [ 0, 128, 255 ], // RGB array
 color2: [ 0, 128, 255, 0.3 ], // RGB with alpha
 color3: { h: 350, s: 0.9, v: 0.3 } // Hue, saturation, value
 };

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

 gui.remember(obj);

 gui.add(obj, 'message');
 gui.add(obj, 'displayOutline');
 gui.add(obj, 'explode');

 gui.add(obj, 'maxSize').min(-10).max(10).step(0.25);
 gui.add(obj, 'height').step(5); // Increment amount

 // Choose from accepted values
 gui.add(obj, 'type', [ 'one', 'two', 'three' ] );

 // Choose from named values
 gui.add(obj, 'speed', { Stopped: 0, Slow: 0.1, Fast: 5 } );

 var f1 = gui.addFolder('Colors');
 f1.addColor(obj, 'color0');
 f1.addColor(obj, 'color1');
 f1.addColor(obj, 'color2');
 f1.addColor(obj, 'color3');

 var f2 = gui.addFolder('Another Folder');
 f2.add(obj, 'noiseStrength');

 var f3 = f2.addFolder('Nested Folder');
 f3.add(obj, 'growthSpeed');

 </script>
</body>
</html>