变换
所有的物体都默认的自动更新它的模型。
但是,如果你知道你的模型是静态的,你可以diable这个,当你许愿灯时候再手动地更新矩阵变换。
object.matrixAutoUpdate=false;
object.updateMatrix();
几何体
你只可以更新顶点的内容,不能调整缓冲区的大小(这是非常昂贵的,通常和创建一个新的几何体差不多)。
你可以通过提前分配一个更大的缓冲区来达到重新分配大小,然后把没有用的顶点隐藏起来。
为你更新设置一个旗帜的属性,更新是昂贵的。一旦顶点改变了,这些旗帜自动地重新设置为false.如果你想保持更新顶点,你需要把它们设置为true.
Geometry._dirtyVertices=true;
Geometry._dirtyMorphTargets=true;
Geometry._dirtyElements=true;
Geometry._dirtyUvs=true;
Geometry._dirtyNormals=true;
Geometry._dirtyTangents=true;
Geometry._dirtyColors=true;
此外,模型也需要将 dynamic 这个旗帜激活
Geometry.dynamic=true;
自定义的属性(inMeshShadrMaterial):
Attributes["attributeName"].needsUpdate=true;
其他的物体,像ParticleSystem,Ribbon,Line只需要“dirty”这个旗帜。
Example:
https://github.com/mrdoob/three.js/blob/master/examples/webgl_geometry_dynamic.html https://github.com/mrdoob/three.js/blob/master/examples/webgl_custom_attributes.html
https://github.com/mrdoob/three.js/blob/master/examples/webgl_custom_attributes_particles.html
https://github.com/mrdoob/three.js/blob/master/examples/webgl_ribbons.html
材质
所有的unifors的值都需要改变(e.g colors,textures,opacity:t不透明,etc),每一帧,这些值都被送到着色器。
同样,GL状态关系到的参数也随时在改变。(depthTest,blending,polygonOffset:多边形位移,etc)
Flat/smooty 着色被归为法线。你需要重新设置法线缓冲区。
下面是一些不会在运行时改变的属性:
Number and types of uniforms
Numbers and types of lights
Presence or not of
Texture
Fog
Vertex colors
Skining
Morphing
Shadow map
Alpha test
改变这些需要创建一个新的着色程序。这里没有API来改变这些。这是非常昂贵的,你或许可以重新创建一个材质了。
你可以模仿改变这些特性通过“dummy" 的值想0强度的光照,白色的纹理,或则
0密度的雾。
二者择一地,你或许会试着删除着色程序(未验证的)
Material.program=null;
可能需要明确删除着色程序
Renderer.context .deleteProgram(material.program);
对于大块的几何体,你可以自由地改变材质,但你不能改变几何体是怎样划分成几块的(根据face材质).
如果在运行时,你需要不同的材质配置,如果number of materials/chunks 太小了,你可以pre-divide object提前(e.g hair/face/body/upper clothes/trousers for human,front/sides/top/glass/tire/interior for car).
如果数目太大(e.g 每张脸可能都不同),考虑到不同地解决方法,用attributes/textures 来划分不同的per-face 。
Example:
https://github.com/mrdoob/three.js/blob/master/examples/webgl_ribbons.html
https://github.com/mrdoob/three.js/blob/master/examples/webgl_materials_cars.html
https://github.com/mrdoob/three.js/blob/master/examples/webgl_postprocessing_dof.html
贴图:
Image,canvas,video and data textures 需要设置一个旗帜
texture.needsUpdate=true;
渲染目标自动更新
Examples"
https://github.com/mrdoob/three.js/blob/master/examples/webgl_materials_video.html
https://github.com/mrdoob/three.js/blob/master/examples/webgl_rtt.html
照相机:
照相机的位置和摄像方向自动更新
如果你需要改变视场、方向,最近距离,最远距离,你需要重新计算视场矩阵
Camera.aspect=window.innerWidth/window.innerHeight;
camera.updateProgectionMatrix();