threejs郭隆邦实战常用技巧

设置背景

1. 渲染器

renderer.setClearColor('red',1);

2. 场景

var scene = new THREE.Scene();
scene.background = new THREE.Color(0x00ffff);//背景颜色设置为青色

3. 场景（图片）

var scene = new THREE.Scene();
var textureLoader = new THREE.TextureLoader();
var texture = textureLoader.load('./背景.jpg');
scene.background = texture;

背景完全透明

var renderer = new THREE.WebGLRenderer({
  alpha: true
});
//半透明效果的话加上
renderer.setClearColor(0xb9d3ff, 0.4); //设置背景颜色和透明度

去掉锯齿

var renderer = new THREE.WebGLRenderer({
  antialias:true,
});

缓冲区

• 颜色缓冲区
• 深度缓冲区
• 模板缓冲区

材质和WebGLRenderer都可以控制渲染管线

渲染视口（剪裁）

可以将canvas画布分为不同的区域

renderer.setViewport(20, 200, window.innerWidth / 2, window.innerHeight / 2)