threeJS里怎样实现更新

变换

所有的物体都默认的自动更新它的模型。

但是，如果你知道你的模型是静态的，你可以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.ht href="https://github.com/mrdoob/three.js/blob/master/examples/webgl_ribbons.html" target=_blank>ml

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();