dat.GUI 函数库是由谷歌的一个民间组织所开发的，在他的帮助下，可以很容易的创建出一个简单的界面组件，可以用来修改代码中的变量。
本示例浏览地址：https://ithanmang.gitee.io/threejs/home/201806/20180623/04-datgui.html
1 示例代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>加入dat.GUI调试插件</title>
<style>
body {
margin: 0;
overflow: hidden;
}
</style>
<script src="../libs/jquery-1.9.1.js"></script>
<script src="../libs/build/three.js"></script>
<script src="../libs/examples/js/libs/dat.gui.min.js"></script>
</head>
<body>
<div id="WebGL-output"></div>
<script>
$(function () {
// 创建场景
var scene = new THREE.Scene();
// 创建相机
var camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 10000);
// 创建渲染器
var webGLRenderer = new THREE.WebGLRenderer();
// 配置相机
camera.position.set(200, 150, 200);
camera.lookAt(new THREE.Vector3(0, 0, 0));
// 配置渲染器
webGLRenderer.antialias = true;
webGLRenderer.autoClear = true;
webGLRenderer.setClearColor(0x050505);
webGLRenderer.setSize(window.innerWidth, window.innerHeight);
webGLRenderer.shadowMap.enabled = true;
// 创建灯光
var ambientLight = new THREE.AmbientLight({
color: 0x404040});
scene.add(ambientLight);
// 添加光源
var spotLight = new THREE.SpotLight(0xcccccc);
spotLight.position.set(-100, 300, 10);
spotLight.castShadow = true;
scene.add(spotLight);
// 创建平面
var planeGeometry =
最低0.47元/天 解锁文章
2225
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
