things.js官方示例基本创建物体的方法(为阅读方便)

  1. 说明:创建App,url为场景地址(可选)
    /**
     * 说明:创建App,url为场景地址(可选)
     */
    var app = new THING.App({
        url: 'https://www.thingjs.com/static/models/storehouse'     // 场景地址
    });
    

     

2. 说明:创建一个Box,并在app的update事件中旋转Box,摄像机看Box

/**
 * 说明:创建一个Box,并在app的update事件中旋转Box,摄像机看Box
 */
var app = new THING.App();

// 创建Box
var box = app.create({
	type: 'Box',
	position: [-4, 0, 0],
});

// update事件
app.on('update', function () {
	box.rotateY(30 * app.deltaTime * 0.001); // 箱子自转
});

// 看Box
app.camera.lookAt(box);

3.创建多种几何体

/**
 * 说明:创建多种几何体
 * 教程:ThingJS教程——>对象创建——>创建物体
 * 难度:★★☆☆☆
 */
var app = new THING.App();

// 创建平面
var plane = app.create({
	type: 'Plane',
	width: 8,
	height: 8,
	position: [0, 0, 0]
});
// 平面旋转90度
plane.rotateX(-90);

// 创建箱子
var box = app.create({
	type: 'Box',
	position: [2, 2, 0], // 箱子坐标
});

// 创建球体
var sphere = app.create({
	type: 'Sphere',
	radius: 0.5, // 半径
	widthSegments: 16, // 节数
	heightSegments: 16,
	position: [4, 4, 0], // 球体坐标
});

// 创建圆柱体
var cylinder = app.create({
	type: 'Cylinder',
	radius: 0.3,
	height: 1.6,
	position: [0, 2, 2]
});

// 创建四面体
var tetrahedron = app.create({
	type: 'Tetrahedron',
	radius: 1,
	position: [0, 2, 0]
});

// update事件
app.on('update', function () {
	// 箱子自转
	box.rotateY(app.deltaTime * 30 * 0.001);

	// 移动球体(上下移动)
	sphere.y = Math.cos(app.elapsedTime * 0.001) * 2;

	// 移动圆柱体(左右移动)
	cylinder.x = Math.cos(app.elapsedTime * 0.001) * 2;
});

// 设置最佳观看位置
app.camera.fit();

// 设置主灯光 开启阴影
var mainLight = {
	shadow: true
};
app.lighting = { mainLight };

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

blueSky-fan

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值