Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
车家大少爷
three.js
提交
c553f340
T
three.js
项目概览
车家大少爷
/
three.js
与 Fork 源项目一致
从无法访问的项目Fork
通知
2
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
T
three.js
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
c553f340
编写于
9月 24, 2017
作者:
L
Lewy Blue
浏览文件
操作
浏览文件
下载
差异文件
Merge branch 'dev' of
https://github.com/mrdoob/three.js
into fbxloader_ambient
上级
18efee3e
270f9db8
变更
29
隐藏空白更改
内联
并排
Showing
29 changed file
with
707 addition
and
285 deletion
+707
-285
docs/api/cameras/OrthographicCamera.html
docs/api/cameras/OrthographicCamera.html
+0
-1
docs/api/core/BufferGeometry.html
docs/api/core/BufferGeometry.html
+0
-3
docs/api/math/Frustum.html
docs/api/math/Frustum.html
+1
-1
docs/api/math/Vector4.html
docs/api/math/Vector4.html
+2
-2
examples/css3d_periodictable.html
examples/css3d_periodictable.html
+4
-4
examples/files.js
examples/files.js
+0
-1
examples/js/loaders/FBXLoader.js
examples/js/loaders/FBXLoader.js
+154
-56
examples/js/loaders/VRMLLoader.js
examples/js/loaders/VRMLLoader.js
+42
-32
examples/js/objects/Mirror.js
examples/js/objects/Mirror.js
+1
-0
examples/js/objects/MirrorRTT.js
examples/js/objects/MirrorRTT.js
+0
-0
examples/js/objects/Sky.js
examples/js/objects/Sky.js
+8
-13
examples/js/objects/Water.js
examples/js/objects/Water.js
+309
-0
examples/js/postprocessing/EffectComposer.js
examples/js/postprocessing/EffectComposer.js
+3
-3
examples/js/postprocessing/OutlinePass.js
examples/js/postprocessing/OutlinePass.js
+16
-7
examples/webgl_animation_cloth.html
examples/webgl_animation_cloth.html
+18
-59
examples/webgl_mirror.html
examples/webgl_mirror.html
+1
-1
examples/webgl_mirror_nodes.html
examples/webgl_mirror_nodes.html
+2
-2
examples/webgl_postprocessing_nodes.html
examples/webgl_postprocessing_nodes.html
+2
-2
examples/webgl_shaders_ocean.html
examples/webgl_shaders_ocean.html
+101
-72
examples/webgl_shaders_sky.html
examples/webgl_shaders_sky.html
+6
-5
examples/webvr_sandbox.html
examples/webvr_sandbox.html
+1
-1
src/core/BufferGeometry.js
src/core/BufferGeometry.js
+0
-2
src/core/Object3D.js
src/core/Object3D.js
+2
-2
src/loaders/MaterialLoader.js
src/loaders/MaterialLoader.js
+7
-0
src/materials/Material.js
src/materials/Material.js
+11
-1
src/renderers/WebGLRenderer.js
src/renderers/WebGLRenderer.js
+1
-7
src/renderers/shaders/ShaderChunk/bsdfs.glsl
src/renderers/shaders/ShaderChunk/bsdfs.glsl
+1
-1
src/renderers/shaders/ShaderChunk/common.glsl
src/renderers/shaders/ShaderChunk/common.glsl
+5
-4
src/textures/Texture.js
src/textures/Texture.js
+9
-3
未找到文件。
docs/api/cameras/OrthographicCamera.html
浏览文件 @
c553f340
...
...
@@ -25,7 +25,6 @@
<h2>
Example
</h2>
<div>
[example:canvas_camera_orthographic camera / orthographic ]
</div>
<div>
[example:canvas_camera_orthographic2 camera / orthographic2 ]
</div>
<div>
[example:webgl_camera camera ]
</div>
<div>
[example:webgl_interactive_cubes_ortho interactive / cubes / ortho ]
</div>
<div>
[example:webgl_materials_cubemap_dynamic materials / cubemap / dynamic ]
</div>
...
...
docs/api/core/BufferGeometry.html
浏览文件 @
c553f340
...
...
@@ -176,9 +176,6 @@
You should not change this, as it used internally for optimisation.
</div>
<h3>
[property:Integer MaxIndex]
</h3>
<div>
Maximum number of vertices allowed, set to *65535*.
</div>
<h3>
[property:Object morphAttributes]
</h3>
<div>
Hashmap of [page:BufferAttribute]s holding details of the geometry's [page:Geometry.morphTargets morphTargets].
...
...
docs/api/math/Frustum.html
浏览文件 @
c553f340
...
...
@@ -98,7 +98,7 @@
<div>
[page:Matrix4 matrix] - [page:Matrix4] used to set the [page:.planes planes]
<br
/><br
/>
This is used by the [page:WebGLRenderer] to set up the Frustum from a [page:Camera Camera
's]
This is used by the [page:WebGLRenderer] to set up the Frustum from a [page:Camera Camera
]'s
[page:Camera.projectionMatrix projectionMatrix] and [page:Camera.matrixWorldInverse matrixWorldInverse].
</div>
...
...
docs/api/math/Vector4.html
浏览文件 @
c553f340
...
...
@@ -231,13 +231,13 @@ var d = a.dot( b );
<h3>
[method:Vector4 max]( [page:Vector4 v] )
</h3>
<div>
If this vector's x, y, z or w value is less than [page:Vector4 v
's]
x, y, z or w value, replace
If this vector's x, y, z or w value is less than [page:Vector4 v
]'s
x, y, z or w value, replace
that value with the corresponding max value.
</div>
<h3>
[method:Vector4 min]( [page:Vector4 v] )
</h3>
<div>
If this vector's x, y, z or w value is greater than [page:Vector4 v
's]
x, y, z or w value, replace
If this vector's x, y, z or w value is greater than [page:Vector4 v
]'s
x, y, z or w value, replace
that value with the corresponding min value.
</div>
...
...
examples/css3d_periodictable.html
浏览文件 @
c553f340
...
...
@@ -228,12 +228,12 @@
"
Ds
"
,
"
Darmstadium
"
,
"
(281)
"
,
10
,
7
,
"
Rg
"
,
"
Roentgenium
"
,
"
(280)
"
,
11
,
7
,
"
Cn
"
,
"
Copernicium
"
,
"
(285)
"
,
12
,
7
,
"
Uut
"
,
"
Unutrium
"
,
"
(284
)
"
,
13
,
7
,
"
Nh
"
,
"
Nihonium
"
,
"
(286
)
"
,
13
,
7
,
"
Fl
"
,
"
Flerovium
"
,
"
(289)
"
,
14
,
7
,
"
Uup
"
,
"
Ununpentium
"
,
"
(288
)
"
,
15
,
7
,
"
Mc
"
,
"
Moscovium
"
,
"
(290
)
"
,
15
,
7
,
"
Lv
"
,
"
Livermorium
"
,
"
(293)
"
,
16
,
7
,
"
Uus
"
,
"
Ununseptium
"
,
"
(294)
"
,
17
,
7
,
"
Uuo
"
,
"
Ununoctium
"
,
"
(294)
"
,
18
,
7
"
Ts
"
,
"
Tennessine
"
,
"
(294)
"
,
17
,
7
,
"
Og
"
,
"
Oganesson
"
,
"
(294)
"
,
18
,
7
];
var
camera
,
scene
,
renderer
;
...
...
examples/files.js
浏览文件 @
c553f340
...
...
@@ -340,7 +340,6 @@ var files = {
"
canvas
"
:
[
"
canvas_ascii_effect
"
,
"
canvas_camera_orthographic
"
,
"
canvas_camera_orthographic2
"
,
"
canvas_geometry_birds
"
,
"
canvas_geometry_cube
"
,
"
canvas_geometry_earth
"
,
...
...
examples/js/loaders/FBXLoader.js
浏览文件 @
c553f340
...
...
@@ -112,7 +112,7 @@
}
console
.
log
(
FBXTree
);
//
console.log( FBXTree );
var
connections
=
parseConnections
(
FBXTree
);
var
images
=
parseImages
(
FBXTree
);
...
...
@@ -1377,83 +1377,105 @@
switch
(
node
.
attrType
)
{
case
'
Mesh
'
:
/**
* @type {?THREE.BufferGeometry}
*/
var
geometry
=
null
;
/**
* @type {THREE.MultiMaterial|THREE.Material}
*/
var
material
=
null
;
/**
* @type {Array.<THREE.Material>}
*/
var
materials
=
[];
case
'
Camera
'
:
/* ***********
* Supported light types:
* PerspectiveCamera
* OrthographicCamera
*
* TODO: Support targets via camera.lookAt
************** */
var
cameraAttribute
;
for
(
var
childrenIndex
=
0
,
childrenLength
=
conns
.
children
.
length
;
childrenIndex
<
childrenLength
;
++
childrenIndex
)
{
var
child
=
conns
.
children
[
childrenIndex
]
;
var
child
ID
=
conns
.
children
[
childrenIndex
].
ID
;
if
(
geometryMap
.
has
(
child
.
ID
)
)
{
var
attr
=
FBXTree
.
Objects
.
subNodes
.
NodeAttribute
[
childID
];
geometry
=
geometryMap
.
get
(
child
.
ID
);
if
(
attr
!==
undefined
&&
attr
.
properties
!==
undefined
)
{
cameraAttribute
=
attr
.
properties
;
}
if
(
materialMap
.
has
(
child
.
ID
)
)
{
}
materials
.
push
(
materialMap
.
get
(
child
.
ID
)
);
if
(
cameraAttribute
===
undefined
)
{
model
=
new
THREE
.
Object3D
();
}
else
{
var
type
=
0
;
if
(
cameraAttribute
.
CameraProjectionType
!==
undefined
&&
(
cameraAttribute
.
CameraProjectionType
.
value
===
'
1
'
||
cameraAttribute
.
CameraProjectionType
.
value
===
1
)
)
{
type
=
1
;
}
}
if
(
materials
.
length
>
1
)
{
var
nearClippingPlane
=
1
;
if
(
cameraAttribute
.
NearPlane
!==
undefined
)
{
material
=
materials
;
nearClippingPlane
=
cameraAttribute
.
NearPlane
.
value
/
1000
;
}
else
if
(
materials
.
length
>
0
)
{
}
material
=
materials
[
0
];
var
farClippingPlane
=
1000
;
if
(
cameraAttribute
.
FarPlane
!==
undefined
)
{
}
else
{
farClippingPlane
=
cameraAttribute
.
FarPlane
.
value
/
1000
;
material
=
new
THREE
.
MeshStandardMaterial
(
{
color
:
0x3300ff
}
);
materials
.
push
(
material
);
}
}
if
(
'
color
'
in
geometry
.
attributes
)
{
for
(
var
materialIndex
=
0
,
numMaterials
=
materials
.
length
;
materialIndex
<
numMaterials
;
++
materialIndex
)
{
var
width
=
window
.
innerWidth
;
var
height
=
window
.
innerHeight
;
materials
[
materialIndex
].
vertexColors
=
THREE
.
VertexColors
;
if
(
cameraAttribute
.
AspectWidth
!==
undefined
&&
cameraAttribute
.
AspectHeight
!==
undefined
)
{
width
=
parseFloat
(
cameraAttribute
.
AspectWidth
.
value
);
height
=
parseFloat
(
cameraAttribute
.
AspectHeight
.
value
);
}
}
if
(
geometry
.
FBX_Deformer
)
{
var
aspect
=
width
/
height
;
for
(
var
materialsIndex
=
0
,
materialsLength
=
materials
.
length
;
materialsIndex
<
materialsLength
;
++
materialsIndex
)
{
var
fov
=
45
;
if
(
cameraAttribute
.
FieldOfView
!==
undefined
)
{
materials
[
materialsIndex
].
skinning
=
true
;
fov
=
parseFloat
(
cameraAttribute
.
FieldOfView
.
value
)
;
}
model
=
new
THREE
.
SkinnedMesh
(
geometry
,
material
);
}
else
{
switch
(
type
)
{
model
=
new
THREE
.
Mesh
(
geometry
,
material
);
case
'
0
'
:
// Perspective
case
0
:
model
=
new
THREE
.
PerspectiveCamera
(
fov
,
aspect
,
nearClippingPlane
,
farClippingPlane
);
break
;
case
'
1
'
:
// Orthographic
case
1
:
model
=
new
THREE
.
OrthographicCamera
(
-
width
/
2
,
width
/
2
,
height
/
2
,
-
height
/
2
,
nearClippingPlane
,
farClippingPlane
);
break
;
default
:
console
.
warn
(
'
THREE.FBXLoader: Unknown camera type
'
+
type
+
'
.
'
);
model
=
new
THREE
.
Object3D
();
break
;
}
}
break
;
case
'
Light
'
:
/* ***********
* Supported light types:
* DirectionalLight
*
PointLight
*
PointLight
* SpotLight
*
* TODO: Support DirectionalLight and SpotLight targets
...
...
@@ -1481,14 +1503,12 @@
}
else
{
console
.
log
(
lightAttribute
);
var
type
;
// LightType
is
undefined for Point lights
// LightType
can be
undefined for Point lights
if
(
lightAttribute
.
LightType
===
undefined
)
{
type
=
'
0
'
;
type
=
0
;
}
else
{
...
...
@@ -1502,9 +1522,9 @@
var
temp
=
lightAttribute
.
Color
.
value
.
split
(
'
,
'
);
var
r
=
parse
Int
(
temp
[
0
],
10
);
var
g
=
parse
Int
(
temp
[
1
],
10
);
var
b
=
parse
Int
(
temp
[
1
],
10
);
var
r
=
parse
Float
(
temp
[
0
]
);
var
g
=
parse
Float
(
temp
[
1
]
);
var
b
=
parse
Float
(
temp
[
1
]
);
color
=
new
THREE
.
Color
(
r
,
g
,
b
);
...
...
@@ -1513,7 +1533,7 @@
var
intensity
=
(
lightAttribute
.
Intensity
===
undefined
)
?
1
:
lightAttribute
.
Intensity
.
value
/
100
;
// light disabled
if
(
lightAttribute
.
CastLightOnObject
!==
undefined
&&
lightAttribute
.
CastLightOnObject
.
value
===
'
0
'
)
{
if
(
lightAttribute
.
CastLightOnObject
!==
undefined
&&
(
lightAttribute
.
CastLightOnObject
.
value
===
'
0
'
||
lightAttribute
.
CastLightOnObject
.
value
===
0
)
)
{
intensity
=
0
;
...
...
@@ -1522,11 +1542,11 @@
var
distance
=
0
;
if
(
lightAttribute
.
FarAttenuationEnd
!==
undefined
)
{
if
(
lightAttribute
.
EnableFarAttenuation
!==
undefined
&&
lightAttribute
.
EnableFarAttenuation
.
value
===
'
0
'
)
{
if
(
lightAttribute
.
EnableFarAttenuation
!==
undefined
&&
(
lightAttribute
.
EnableFarAttenuation
.
value
===
'
0
'
||
lightAttribute
.
EnableFarAttenuation
.
value
===
0
)
)
{
distance
=
0
;
}
else
{
}
else
{
distance
=
lightAttribute
.
FarAttenuationEnd
.
value
/
1000
;
...
...
@@ -1535,20 +1555,23 @@
}
// TODO
// could be calculated linearly from FarAttenuationStart to FarAttenuationEnd
?
// could be calculated linearly from FarAttenuationStart to FarAttenuationEnd?
var
decay
=
1
;
switch
(
type
)
{
case
'
0
'
:
// Point
case
0
:
model
=
new
THREE
.
PointLight
(
color
,
intensity
,
distance
,
decay
);
break
;
case
'
1
'
:
// Directional
case
1
:
model
=
new
THREE
.
DirectionalLight
(
color
,
intensity
);
break
;
case
'
2
'
:
// Spot
case
2
:
var
angle
=
Math
.
PI
/
3
;
if
(
lightAttribute
.
InnerAngle
!==
undefined
)
{
...
...
@@ -1557,10 +1580,10 @@
}
var
penumbra
=
0
;
// Falloff / Field
var
penumbra
=
0
;
if
(
lightAttribute
.
OuterAngle
!==
undefined
)
{
//
note
: this is not correct - FBX calculates outer and inner angle in degrees
//
TODO
: this is not correct - FBX calculates outer and inner angle in degrees
// with OuterAngle > InnerAngle && OuterAngle <= Math.PI
// while three.js uses a penumbra between (0, 1) to attenuate the inner angle
penumbra
=
THREE
.
Math
.
degToRad
(
lightAttribute
.
OuterAngle
.
value
);
...
...
@@ -1572,13 +1595,13 @@
break
;
default
:
console
.
warn
(
'
THREE.FBXLoader: Unknown light type
'
+
lightAttribute
.
LightType
+
'
, defaulting to a THREE.PointLight.
'
);
console
.
warn
(
'
THREE.FBXLoader: Unknown light type
'
+
lightAttribute
.
LightType
.
value
+
'
, defaulting to a THREE.PointLight.
'
);
model
=
new
THREE
.
PointLight
(
color
,
intensity
);
break
;
}
if
(
lightAttribute
.
CastShadows
!==
undefined
&&
lightAttribute
.
CastShadows
.
value
===
'
1
'
)
{
if
(
lightAttribute
.
CastShadows
!==
undefined
&&
(
lightAttribute
.
CastShadows
.
value
===
'
1
'
||
lightAttribute
.
CastShadows
.
value
===
1
)
)
{
model
.
castShadow
=
true
;
...
...
@@ -1588,6 +1611,78 @@
break
;
case
'
Mesh
'
:
/**
* @type {?THREE.BufferGeometry}
*/
var
geometry
=
null
;
/**
* @type {THREE.MultiMaterial|THREE.Material}
*/
var
material
=
null
;
/**
* @type {Array.<THREE.Material>}
*/
var
materials
=
[];
for
(
var
childrenIndex
=
0
,
childrenLength
=
conns
.
children
.
length
;
childrenIndex
<
childrenLength
;
++
childrenIndex
)
{
var
child
=
conns
.
children
[
childrenIndex
];
if
(
geometryMap
.
has
(
child
.
ID
)
)
{
geometry
=
geometryMap
.
get
(
child
.
ID
);
}
if
(
materialMap
.
has
(
child
.
ID
)
)
{
materials
.
push
(
materialMap
.
get
(
child
.
ID
)
);
}
}
if
(
materials
.
length
>
1
)
{
material
=
materials
;
}
else
if
(
materials
.
length
>
0
)
{
material
=
materials
[
0
];
}
else
{
material
=
new
THREE
.
MeshStandardMaterial
(
{
color
:
0x3300ff
}
);
materials
.
push
(
material
);
}
if
(
'
color
'
in
geometry
.
attributes
)
{
for
(
var
materialIndex
=
0
,
numMaterials
=
materials
.
length
;
materialIndex
<
numMaterials
;
++
materialIndex
)
{
materials
[
materialIndex
].
vertexColors
=
THREE
.
VertexColors
;
}
}
if
(
geometry
.
FBX_Deformer
)
{
for
(
var
materialsIndex
=
0
,
materialsLength
=
materials
.
length
;
materialsIndex
<
materialsLength
;
++
materialsIndex
)
{
materials
[
materialsIndex
].
skinning
=
true
;
}
model
=
new
THREE
.
SkinnedMesh
(
geometry
,
material
);
}
else
{
model
=
new
THREE
.
Mesh
(
geometry
,
material
);
}
break
;
case
'
NurbsCurve
'
:
var
geometry
=
null
;
...
...
@@ -4896,6 +4991,9 @@
}
// Manage UTF8 encoding
s
=
decodeURIComponent
(
escape
(
s
)
);
this
.
skip
(
size
);
return
s
;
...
...
examples/js/loaders/VRMLLoader.js
浏览文件 @
c553f340
...
...
@@ -633,14 +633,14 @@ THREE.VRMLLoader.prototype = {
}
if
(
'
AmbientLight
'
===
data
.
nodeType
)
{
if
(
data
.
nodeType
===
'
AmbientLight
'
)
{
object
=
new
THREE
.
AmbientLight
(
l_color
,
l_intensity
);
object
.
visible
=
l_visible
;
parent
.
add
(
object
);
}
else
if
(
'
PointLight
'
===
data
.
nodeType
)
{
}
else
if
(
data
.
nodeType
===
'
PointLight
'
)
{
var
l_distance
=
0
;
...
...
@@ -655,7 +655,7 @@ THREE.VRMLLoader.prototype = {
parent
.
add
(
object
);
}
else
if
(
'
SpotLight
'
===
data
.
nodeType
)
{
}
else
if
(
data
.
nodeType
===
'
SpotLight
'
)
{
var
l_intensity
=
1
;
var
l_distance
=
0
;
...
...
@@ -680,7 +680,7 @@ THREE.VRMLLoader.prototype = {
parent
.
add
(
object
);
}
else
if
(
'
Transform
'
===
data
.
nodeType
||
'
Group
'
===
data
.
nodeType
)
{
}
else
if
(
data
.
nodeType
===
'
Transform
'
||
data
.
nodeType
===
'
Group
'
)
{
object
=
new
THREE
.
Object3D
();
...
...
@@ -691,7 +691,7 @@ THREE.VRMLLoader.prototype = {
}
if
(
undefined
!==
data
[
'
translation
'
]
)
{
if
(
data
.
translation
!==
undefined
)
{
var
t
=
data
.
translation
;
...
...
@@ -699,7 +699,7 @@ THREE.VRMLLoader.prototype = {
}
if
(
undefined
!==
data
.
rotation
)
{
if
(
data
.
rotation
!==
undefined
)
{
var
r
=
data
.
rotation
;
...
...
@@ -707,7 +707,7 @@ THREE.VRMLLoader.prototype = {
}
if
(
undefined
!==
data
.
scale
)
{
if
(
data
.
scale
!==
undefined
)
{
var
s
=
data
.
scale
;
...
...
@@ -717,7 +717,7 @@ THREE.VRMLLoader.prototype = {
parent
.
add
(
object
);
}
else
if
(
'
Shape
'
===
data
.
nodeType
)
{
}
else
if
(
data
.
nodeType
===
'
Shape
'
)
{
object
=
new
THREE
.
Mesh
();
...
...
@@ -731,7 +731,7 @@ THREE.VRMLLoader.prototype = {
parent
.
add
(
object
);
}
else
if
(
'
Background
'
===
data
.
nodeType
)
{
}
else
if
(
data
.
nodeType
===
'
Background
'
)
{
var
segments
=
20
;
...
...
@@ -774,25 +774,25 @@ THREE.VRMLLoader.prototype = {
}
else
if
(
/geometry/
.
exec
(
data
.
string
)
)
{
if
(
'
Box
'
===
data
.
nodeType
)
{
if
(
data
.
nodeType
===
'
Box
'
)
{
var
s
=
data
.
size
;
parent
.
geometry
=
new
THREE
.
BoxBufferGeometry
(
s
.
x
,
s
.
y
,
s
.
z
);
}
else
if
(
'
Cylinder
'
===
data
.
nodeType
)
{
}
else
if
(
data
.
nodeType
===
'
Cylinder
'
)
{
parent
.
geometry
=
new
THREE
.
CylinderBufferGeometry
(
data
.
radius
,
data
.
radius
,
data
.
height
);
}
else
if
(
'
Cone
'
===
data
.
nodeType
)
{
}
else
if
(
data
.
nodeType
===
'
Cone
'
)
{
parent
.
geometry
=
new
THREE
.
CylinderBufferGeometry
(
data
.
topRadius
,
data
.
bottomRadius
,
data
.
height
);
}
else
if
(
'
Sphere
'
===
data
.
nodeType
)
{
}
else
if
(
data
.
nodeType
===
'
Sphere
'
)
{
parent
.
geometry
=
new
THREE
.
SphereBufferGeometry
(
data
.
radius
);
}
else
if
(
'
IndexedFaceSet
'
===
data
.
nodeType
)
{
}
else
if
(
data
.
nodeType
===
'
IndexedFaceSet
'
)
{
var
geometry
=
new
THREE
.
BufferGeometry
();
...
...
@@ -809,7 +809,7 @@ THREE.VRMLLoader.prototype = {
// uvs
if
(
'
TextureCoordinate
'
===
child
.
nodeType
)
{
if
(
child
.
nodeType
===
'
TextureCoordinate
'
)
{
if
(
child
.
points
)
{
...
...
@@ -826,7 +826,7 @@ THREE.VRMLLoader.prototype = {
// positions
if
(
'
Coordinate
'
===
child
.
nodeType
)
{
if
(
child
.
nodeType
===
'
Coordinate
'
)
{
if
(
child
.
points
)
{
...
...
@@ -881,6 +881,8 @@ THREE.VRMLLoader.prototype = {
while
(
indexes
.
length
>=
3
&&
skip
<
(
indexes
.
length
-
2
)
)
{
if
(
data
.
ccw
===
undefined
)
data
.
ccw
=
true
;
// ccw is true by default
var
i1
=
indexes
[
0
];
var
i2
=
indexes
[
skip
+
(
data
.
ccw
?
1
:
2
)
];
var
i3
=
indexes
[
skip
+
(
data
.
ccw
?
2
:
1
)
];
...
...
@@ -959,11 +961,11 @@ THREE.VRMLLoader.prototype = {
var
child
=
data
.
children
[
i
];
if
(
'
Material
'
===
child
.
nodeType
)
{
if
(
child
.
nodeType
===
'
Material
'
)
{
var
material
=
new
THREE
.
MeshPhongMaterial
();
if
(
undefined
!==
child
.
diffuseColor
)
{
if
(
child
.
diffuseColor
!==
undefined
)
{
var
d
=
child
.
diffuseColor
;
...
...
@@ -971,7 +973,7 @@ THREE.VRMLLoader.prototype = {
}
if
(
undefined
!==
child
.
emissiveColor
)
{
if
(
child
.
emissiveColor
!==
undefined
)
{
var
e
=
child
.
emissiveColor
;
...
...
@@ -979,7 +981,7 @@ THREE.VRMLLoader.prototype = {
}
if
(
undefined
!==
child
.
specularColor
)
{
if
(
child
.
specularColor
!==
undefined
)
{
var
s
=
child
.
specularColor
;
...
...
@@ -987,7 +989,7 @@ THREE.VRMLLoader.prototype = {
}
if
(
undefined
!==
child
.
transparency
)
{
if
(
child
.
transparency
!==
undefined
)
{
var
t
=
child
.
transparency
;
...
...
@@ -1010,7 +1012,7 @@ THREE.VRMLLoader.prototype = {
}
if
(
'
ImageTexture
'
===
child
.
nodeType
)
{
if
(
child
.
nodeType
===
'
ImageTexture
'
)
{
var
textureName
=
/"
([^
"
]
+
)
"/
.
exec
(
child
.
children
[
0
]
);
...
...
@@ -1047,41 +1049,49 @@ THREE.VRMLLoader.prototype = {
var
lines
=
data
.
split
(
'
\n
'
);
// some lines do not have breaks
for
(
var
i
=
lines
.
length
-
1
;
i
>
-
1
;
i
--
)
{
var
line
=
lines
[
i
];
// split lines with {..{ or {..[ - some have both
if
(
/{.*
[
{
\[]
/
.
test
(
line
s
[
i
]
)
)
{
if
(
/{.*
[
{
\[]
/
.
test
(
line
)
)
{
var
parts
=
line
s
[
i
]
.
split
(
'
{
'
).
join
(
'
{
\n
'
).
split
(
'
\n
'
);
var
parts
=
line
.
split
(
'
{
'
).
join
(
'
{
\n
'
).
split
(
'
\n
'
);
parts
.
unshift
(
1
);
parts
.
unshift
(
i
);
lines
.
splice
.
apply
(
lines
,
parts
);
}
else
if
(
/
\]
.*}/
.
test
(
line
s
[
i
]
)
)
{
}
else
if
(
/
\]
.*}/
.
test
(
line
)
)
{
// split lines with ]..}
var
parts
=
line
s
[
i
]
.
split
(
'
]
'
).
join
(
'
]
\n
'
).
split
(
'
\n
'
);
var
parts
=
line
.
split
(
'
]
'
).
join
(
'
]
\n
'
).
split
(
'
\n
'
);
parts
.
unshift
(
1
);
parts
.
unshift
(
i
);
lines
.
splice
.
apply
(
lines
,
parts
);
}
if
(
/}.*}/
.
test
(
line
s
[
i
]
)
)
{
if
(
/}.*}/
.
test
(
line
)
)
{
// split lines with }..}
var
parts
=
lines
[
i
].
split
(
'
}
'
).
join
(
'
}
\n
'
).
split
(
'
\n
'
);
var
parts
=
line
.
split
(
'
}
'
).
join
(
'
}
\n
'
).
split
(
'
\n
'
);
parts
.
unshift
(
1
);
parts
.
unshift
(
i
);
lines
.
splice
.
apply
(
lines
,
parts
);
}
// force the parser to create Coordinate node for empty coords
// coord USE something -> coord USE something Coordinate {}
if
(
/^
\b[^\s]
+
\b
$/
.
test
(
line
.
trim
()
)
)
{
// prevent lines with single words like "coord" or "geometry", see #12209
lines
[
i
+
1
]
=
line
+
'
'
+
lines
[
i
+
1
].
trim
();
lines
.
splice
(
i
,
1
);
}
else
if
(
(
line
.
indexOf
(
'
coord
'
)
>
-
1
)
&&
(
line
.
indexOf
(
'
[
'
)
<
0
)
&&
(
line
.
indexOf
(
'
{
'
)
<
0
)
)
{
if
(
(
lines
[
i
].
indexOf
(
'
coord
'
)
>
-
1
)
&&
(
lines
[
i
].
indexOf
(
'
[
'
)
<
0
)
&&
(
lines
[
i
].
indexOf
(
'
{
'
)
<
0
)
)
{
// force the parser to create Coordinate node for empty coords
// coord USE something -> coord USE something Coordinate {}
lines
[
i
]
+=
'
Coordinate {}
'
;
...
...
examples/js/Mirror.js
→
examples/js/
objects/
Mirror.js
浏览文件 @
c553f340
...
...
@@ -239,3 +239,4 @@ THREE.Mirror = function ( width, height, options ) {
};
THREE
.
Mirror
.
prototype
=
Object
.
create
(
THREE
.
Mesh
.
prototype
);
THREE
.
Mirror
.
prototype
.
constructor
=
THREE
.
Mirror
;
examples/js/MirrorRTT.js
→
examples/js/
objects/
MirrorRTT.js
浏览文件 @
c553f340
文件已移动
examples/js/
SkyShader
.js
→
examples/js/
objects/Sky
.js
浏览文件 @
c553f340
...
...
@@ -16,26 +16,21 @@
THREE
.
Sky
=
function
()
{
var
s
kyS
hader
=
THREE
.
Sky
.
SkyShader
;
var
shader
=
THREE
.
Sky
.
SkyShader
;
var
skyUniforms
=
THREE
.
UniformsUtils
.
clone
(
skyShader
.
uniforms
);
var
skyMat
=
new
THREE
.
ShaderMaterial
(
{
fragmentShader
:
skyShader
.
fragmentShader
,
vertexShader
:
skyShader
.
vertexShader
,
uniforms
:
skyUniforms
,
var
material
=
new
THREE
.
ShaderMaterial
(
{
fragmentShader
:
shader
.
fragmentShader
,
vertexShader
:
shader
.
vertexShader
,
uniforms
:
THREE
.
UniformsUtils
.
clone
(
shader
.
uniforms
),
side
:
THREE
.
BackSide
}
);
var
skyGeo
=
new
THREE
.
SphereBufferGeometry
(
450000
,
32
,
15
);
var
skyMesh
=
new
THREE
.
Mesh
(
skyGeo
,
skyMat
);
// Expose variables
this
.
mesh
=
skyMesh
;
this
.
uniforms
=
skyUniforms
;
THREE
.
Mesh
.
call
(
this
,
new
THREE
.
SphereBufferGeometry
(
1
,
32
,
15
),
material
);
};
THREE
.
Sky
.
prototype
=
Object
.
create
(
THREE
.
Mesh
.
prototype
);
THREE
.
Sky
.
SkyShader
=
{
uniforms
:
{
...
...
examples/js/
WaterShad
er.js
→
examples/js/
objects/Wat
er.js
浏览文件 @
c553f340
...
...
@@ -7,72 +7,73 @@
* @author Jonas Wagner / http://29a.ch/ && http://29a.ch/slides/2012/webglwater/ : Water shader explanations in WebGL
*/
THREE
.
Water
=
function
(
renderer
,
camera
,
scene
,
options
)
{
THREE
.
Water
=
function
(
width
,
height
,
options
)
{
THREE
.
Object3D
.
call
(
this
);
this
.
name
=
'
water_
'
+
this
.
id
;
THREE
.
Mesh
.
call
(
this
,
new
THREE
.
PlaneBufferGeometry
(
width
,
height
)
);
function
optionalParameter
(
value
,
defaultValue
)
{
var
scope
=
this
;
return
value
!==
undefined
?
value
:
defaultValue
;
options
=
options
||
{}
;
}
var
textureWidth
=
options
.
textureWidth
!==
undefined
?
options
.
textureWidth
:
512
;
var
textureHeight
=
options
.
textureHeight
!==
undefined
?
options
.
textureHeight
:
512
;
var
clipBias
=
options
.
clipBias
!==
undefined
?
options
.
clipBias
:
0.0
;
var
alpha
=
options
.
alpha
!==
undefined
?
options
.
alpha
:
1.0
;
var
time
=
options
.
time
!==
undefined
?
options
.
time
:
0.0
;
var
normalSampler
=
options
.
waterNormals
!==
undefined
?
options
.
waterNormals
:
null
;
var
sunDirection
=
options
.
sunDirection
!==
undefined
?
options
.
sunDirection
:
new
THREE
.
Vector3
(
0.70707
,
0.70707
,
0.0
);
var
sunColor
=
new
THREE
.
Color
(
options
.
sunColor
!==
undefined
?
options
.
sunColor
:
0xffffff
);
var
waterColor
=
new
THREE
.
Color
(
options
.
waterColor
!==
undefined
?
options
.
waterColor
:
0x7F7F7F
);
var
eye
=
options
.
eye
!==
undefined
?
options
.
eye
:
new
THREE
.
Vector3
(
0
,
0
,
0
);
var
distortionScale
=
options
.
distortionScale
!==
undefined
?
options
.
distortionScale
:
20.0
;
var
side
=
options
.
side
!==
undefined
?
options
.
side
:
THREE
.
FrontSide
;
var
fog
=
options
.
fog
!==
undefined
?
options
.
fog
:
false
;
//
var
mirrorPlane
=
new
THREE
.
Plane
();
var
normal
=
new
THREE
.
Vector3
();
var
mirrorWorldPosition
=
new
THREE
.
Vector3
();
var
cameraWorldPosition
=
new
THREE
.
Vector3
();
var
rotationMatrix
=
new
THREE
.
Matrix4
();
var
lookAtPosition
=
new
THREE
.
Vector3
(
0
,
0
,
-
1
);
var
clipPlane
=
new
THREE
.
Vector4
();
var
view
=
new
THREE
.
Vector3
();
var
target
=
new
THREE
.
Vector3
();
var
q
=
new
THREE
.
Vector4
();
options
=
options
||
{}
;
var
textureMatrix
=
new
THREE
.
Matrix4
()
;
this
.
matrixNeedsUpdate
=
true
;
var
width
=
optionalParameter
(
options
.
textureWidth
,
512
);
var
height
=
optionalParameter
(
options
.
textureHeight
,
512
);
this
.
clipBias
=
optionalParameter
(
options
.
clipBias
,
0.0
);
this
.
alpha
=
optionalParameter
(
options
.
alpha
,
1.0
);
this
.
time
=
optionalParameter
(
options
.
time
,
0.0
);
this
.
normalSampler
=
optionalParameter
(
options
.
waterNormals
,
null
);
this
.
sunDirection
=
optionalParameter
(
options
.
sunDirection
,
new
THREE
.
Vector3
(
0.70707
,
0.70707
,
0.0
)
);
this
.
sunColor
=
new
THREE
.
Color
(
optionalParameter
(
options
.
sunColor
,
0xffffff
)
);
this
.
waterColor
=
new
THREE
.
Color
(
optionalParameter
(
options
.
waterColor
,
0x7F7F7F
)
);
this
.
eye
=
optionalParameter
(
options
.
eye
,
new
THREE
.
Vector3
(
0
,
0
,
0
)
);
this
.
distortionScale
=
optionalParameter
(
options
.
distortionScale
,
20.0
);
this
.
side
=
optionalParameter
(
options
.
side
,
THREE
.
FrontSide
);
this
.
fog
=
optionalParameter
(
options
.
fog
,
false
);
this
.
renderer
=
renderer
;
this
.
scene
=
scene
;
this
.
mirrorPlane
=
new
THREE
.
Plane
();
this
.
normal
=
new
THREE
.
Vector3
(
0
,
0
,
1
);
this
.
mirrorWorldPosition
=
new
THREE
.
Vector3
();
this
.
cameraWorldPosition
=
new
THREE
.
Vector3
();
this
.
rotationMatrix
=
new
THREE
.
Matrix4
();
this
.
lookAtPosition
=
new
THREE
.
Vector3
(
0
,
0
,
-
1
);
this
.
clipPlane
=
new
THREE
.
Vector4
();
if
(
camera
instanceof
THREE
.
PerspectiveCamera
)
{
this
.
camera
=
camera
;
}
else
{
this
.
camera
=
new
THREE
.
PerspectiveCamera
();
console
.
log
(
this
.
name
+
'
: camera is not a Perspective Camera!
'
);
var
mirrorCamera
=
new
THREE
.
PerspectiveCamera
();
}
var
parameters
=
{
minFilter
:
THREE
.
LinearFilter
,
magFilter
:
THREE
.
LinearFilter
,
format
:
THREE
.
RGBFormat
,
stencilBuffer
:
false
};
var
renderTarget
=
new
THREE
.
WebGLRenderTarget
(
textureWidth
,
textureHeight
,
parameters
);
this
.
textureMatrix
=
new
THREE
.
Matrix4
();
if
(
!
THREE
.
Math
.
isPowerOfTwo
(
textureWidth
)
||
!
THREE
.
Math
.
isPowerOfTwo
(
textureHeight
)
)
{
this
.
mirrorCamera
=
this
.
camera
.
clone
()
;
renderTarget
.
texture
.
generateMipmaps
=
false
;
this
.
renderTarget
=
new
THREE
.
WebGLRenderTarget
(
width
,
height
);
this
.
renderTarget2
=
new
THREE
.
WebGLRenderTarget
(
width
,
height
);
}
var
mirrorShader
=
{
uniforms
:
THREE
.
UniformsUtils
.
merge
(
[
THREE
.
UniformsLib
[
'
fog
'
],
THREE
.
UniformsLib
[
'
lights
'
],
{
normalSampler
:
{
value
:
null
},
mirrorSampler
:
{
value
:
null
},
alpha
:
{
value
:
1.0
},
time
:
{
value
:
0.0
},
size
:
{
value
:
1.0
},
distortionScale
:
{
value
:
20.0
},
noiseScale
:
{
value
:
1.0
},
textureMatrix
:
{
value
:
new
THREE
.
Matrix4
()
},
...
...
@@ -88,28 +89,29 @@ THREE.Water = function ( renderer, camera, scene, options ) {
'
uniform float time;
'
,
'
varying vec4 mirrorCoord;
'
,
'
varying vec
3
worldPosition;
'
,
'
varying vec
4
worldPosition;
'
,
THREE
.
ShaderChunk
[
'
fog_pars_vertex
'
],
THREE
.
ShaderChunk
[
'
shadowmap_pars_vertex
'
],
'
void main() {
'
,
'
mirrorCoord = modelMatrix * vec4( position, 1.0 );
'
,
'
worldPosition = mirrorCoord.xyz;
'
,
'
worldPosition = mirrorCoord.xyz
w
;
'
,
'
mirrorCoord = textureMatrix * mirrorCoord;
'
,
'
vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
'
,
'
gl_Position = projectionMatrix * mvPosition;
'
,
THREE
.
ShaderChunk
[
'
fog_vertex
'
],
THREE
.
ShaderChunk
[
'
shadowmap_vertex
'
],
'
}
'
].
join
(
'
\n
'
),
fragmentShader
:
[
'
precision highp float;
'
,
'
uniform sampler2D mirrorSampler;
'
,
'
uniform float alpha;
'
,
'
uniform float time;
'
,
'
uniform float size;
'
,
'
uniform float distortionScale;
'
,
'
uniform sampler2D normalSampler;
'
,
'
uniform vec3 sunColor;
'
,
...
...
@@ -118,7 +120,7 @@ THREE.Water = function ( renderer, camera, scene, options ) {
'
uniform vec3 waterColor;
'
,
'
varying vec4 mirrorCoord;
'
,
'
varying vec
3
worldPosition;
'
,
'
varying vec
4
worldPosition;
'
,
'
vec4 getNoise( vec2 uv ) {
'
,
'
vec2 uv0 = ( uv / 103.0 ) + vec2(time / 17.0, time / 29.0);
'
,
...
...
@@ -140,16 +142,21 @@ THREE.Water = function ( renderer, camera, scene, options ) {
'
}
'
,
THREE
.
ShaderChunk
[
'
common
'
],
THREE
.
ShaderChunk
[
'
packing
'
],
THREE
.
ShaderChunk
[
'
bsdfs
'
],
THREE
.
ShaderChunk
[
'
fog_pars_fragment
'
],
THREE
.
ShaderChunk
[
'
lights_pars
'
],
THREE
.
ShaderChunk
[
'
shadowmap_pars_fragment
'
],
THREE
.
ShaderChunk
[
'
shadowmask_pars_fragment
'
],
'
void main() {
'
,
'
vec4 noise = getNoise( worldPosition.xz );
'
,
'
vec4 noise = getNoise( worldPosition.xz
* size
);
'
,
'
vec3 surfaceNormal = normalize( noise.xzy * vec3( 1.5, 1.0, 1.5 ) );
'
,
'
vec3 diffuseLight = vec3(0.0);
'
,
'
vec3 specularLight = vec3(0.0);
'
,
'
vec3 worldToEye = eye-worldPosition;
'
,
'
vec3 worldToEye = eye-worldPosition
.xyz
;
'
,
'
vec3 eyeDirection = normalize( worldToEye );
'
,
'
sunLight( surfaceNormal, eyeDirection, 100.0, 2.0, 0.5, diffuseLight, specularLight );
'
,
...
...
@@ -162,10 +169,11 @@ THREE.Water = function ( renderer, camera, scene, options ) {
'
float rf0 = 0.3;
'
,
'
float reflectance = rf0 + ( 1.0 - rf0 ) * pow( ( 1.0 - theta ), 5.0 );
'
,
'
vec3 scatter = max( 0.0, dot( surfaceNormal, eyeDirection ) ) * waterColor;
'
,
'
vec3 albedo = mix(
sunColor * diffuseLight * 0.3 + scatter, ( vec3( 0.1 ) + reflectionSample * 0.9 + reflectionSample * specularLight ), reflectance
);
'
,
'
vec3 albedo = mix(
( sunColor * diffuseLight * 0.3 + scatter ) * getShadowMask(), ( vec3( 0.1 ) + reflectionSample * 0.9 + reflectionSample * specularLight ), reflectance
);
'
,
'
vec3 outgoingLight = albedo;
'
,
'
gl_FragColor = vec4( outgoingLight, alpha );
'
,
THREE
.
ShaderChunk
[
'
tonemapping_fragment
'
],
THREE
.
ShaderChunk
[
'
fog_fragment
'
],
'
}
'
...
...
@@ -173,150 +181,129 @@ THREE.Water = function ( renderer, camera, scene, options ) {
};
var
mirrorUniforms
=
THREE
.
UniformsUtils
.
clone
(
mirrorShader
.
uniforms
);
this
.
material
=
new
THREE
.
ShaderMaterial
(
{
var
material
=
new
THREE
.
ShaderMaterial
(
{
fragmentShader
:
mirrorShader
.
fragmentShader
,
vertexShader
:
mirrorShader
.
vertexShader
,
uniforms
:
mirrorUniforms
,
uniforms
:
THREE
.
UniformsUtils
.
clone
(
mirrorShader
.
uniforms
)
,
transparent
:
true
,
side
:
this
.
side
,
fog
:
this
.
fog
lights
:
true
,
side
:
side
,
fog
:
fog
}
);
this
.
material
.
uniforms
.
mirrorSampler
.
value
=
this
.
renderTarget
.
texture
;
this
.
material
.
uniforms
.
textureMatrix
.
value
=
this
.
textureMatrix
;
this
.
material
.
uniforms
.
alpha
.
value
=
this
.
alpha
;
this
.
material
.
uniforms
.
time
.
value
=
this
.
time
;
this
.
material
.
uniforms
.
normalSampler
.
value
=
this
.
normalSampler
;
this
.
material
.
uniforms
.
sunColor
.
value
=
this
.
sunColor
;
this
.
material
.
uniforms
.
waterColor
.
value
=
this
.
waterColor
;
this
.
material
.
uniforms
.
sunDirection
.
value
=
this
.
sunDirection
;
this
.
material
.
uniforms
.
distortionScale
.
value
=
this
.
distortionScale
;
material
.
uniforms
.
mirrorSampler
.
value
=
renderTarget
.
texture
;
material
.
uniforms
.
textureMatrix
.
value
=
textureMatrix
;
material
.
uniforms
.
alpha
.
value
=
alpha
;
material
.
uniforms
.
time
.
value
=
time
;
material
.
uniforms
.
normalSampler
.
value
=
normalSampler
;
material
.
uniforms
.
sunColor
.
value
=
sunColor
;
material
.
uniforms
.
waterColor
.
value
=
waterColor
;
material
.
uniforms
.
sunDirection
.
value
=
sunDirection
;
material
.
uniforms
.
distortionScale
.
value
=
distortionScale
;
this
.
material
.
uniforms
.
eye
.
value
=
this
.
eye
;
material
.
uniforms
.
eye
.
value
=
eye
;
if
(
!
THREE
.
Math
.
isPowerOfTwo
(
width
)
||
!
THREE
.
Math
.
isPowerOfTwo
(
height
)
)
{
scope
.
material
=
material
;
this
.
renderTarget
.
texture
.
generateMipmaps
=
false
;
this
.
renderTarget
.
texture
.
minFilter
=
THREE
.
LinearFilter
;
this
.
renderTarget2
.
texture
.
generateMipmaps
=
false
;
this
.
renderTarget2
.
texture
.
minFilter
=
THREE
.
LinearFilter
;
scope
.
onBeforeRender
=
function
(
renderer
,
scene
,
camera
)
{
}
mirrorWorldPosition
.
setFromMatrixPosition
(
scope
.
matrixWorld
);
cameraWorldPosition
.
setFromMatrixPosition
(
camera
.
matrixWorld
);
this
.
updateTextureMatrix
();
this
.
render
();
rotationMatrix
.
extractRotation
(
scope
.
matrixWorld
);
};
normal
.
set
(
0
,
0
,
1
);
normal
.
applyMatrix4
(
rotationMatrix
);
THREE
.
Water
.
prototype
=
Object
.
create
(
THREE
.
Object3D
.
prototype
);
THREE
.
Water
.
prototype
.
constructor
=
THREE
.
Water
;
view
.
subVectors
(
mirrorWorldPosition
,
cameraWorldPosition
);
THREE
.
Water
.
prototype
.
render
=
function
()
{
// Avoid rendering when mirror is facing away
if
(
this
.
matrixNeedsUpdate
)
this
.
updateTextureMatrix
()
;
if
(
view
.
dot
(
normal
)
>
0
)
return
;
this
.
matrixNeedsUpdate
=
true
;
view
.
reflect
(
normal
).
negate
();
view
.
add
(
mirrorWorldPosition
);
// Render the mirrored view of the current scene into the target texture
var
scene
=
this
;
rotationMatrix
.
extractRotation
(
camera
.
matrixWorld
);
while
(
scene
.
parent
!==
null
)
{
lookAtPosition
.
set
(
0
,
0
,
-
1
);
lookAtPosition
.
applyMatrix4
(
rotationMatrix
);
lookAtPosition
.
add
(
cameraWorldPosition
);
scene
=
scene
.
parent
;
target
.
subVectors
(
mirrorWorldPosition
,
lookAtPosition
);
target
.
reflect
(
normal
).
negate
();
target
.
add
(
mirrorWorldPosition
);
}
mirrorCamera
.
position
.
copy
(
view
);
mirrorCamera
.
up
.
set
(
0
,
1
,
0
);
mirrorCamera
.
up
.
applyMatrix4
(
rotationMatrix
);
mirrorCamera
.
up
.
reflect
(
normal
);
mirrorCamera
.
lookAt
(
target
);
if
(
scene
!==
undefined
&&
scene
instanceof
THREE
.
Scene
)
{
mirrorCamera
.
far
=
camera
.
far
;
// Used in WebGLBackground
this
.
material
.
visible
=
false
;
mirrorCamera
.
updateMatrixWorld
();
mirrorCamera
.
projectionMatrix
.
copy
(
camera
.
projectionMatrix
);
this
.
renderer
.
render
(
scene
,
this
.
mirrorCamera
,
this
.
renderTarget
,
true
);
// Update the texture matrix
textureMatrix
.
set
(
0.5
,
0.0
,
0.0
,
0.5
,
0.0
,
0.5
,
0.0
,
0.5
,
0.0
,
0.0
,
0.5
,
0.5
,
0.0
,
0.0
,
0.0
,
1.0
);
textureMatrix
.
multiply
(
mirrorCamera
.
projectionMatrix
);
textureMatrix
.
multiply
(
mirrorCamera
.
matrixWorldInverse
);
this
.
material
.
visible
=
true
;
}
};
// Now update projection matrix with new clip plane, implementing code from: http://www.terathon.com/code/oblique.html
// Paper explaining this technique: http://www.terathon.com/lengyel/Lengyel-Oblique.pdf
mirrorPlane
.
setFromNormalAndCoplanarPoint
(
normal
,
mirrorWorldPosition
);
mirrorPlane
.
applyMatrix4
(
mirrorCamera
.
matrixWorldInverse
);
clipPlane
.
set
(
mirrorPlane
.
normal
.
x
,
mirrorPlane
.
normal
.
y
,
mirrorPlane
.
normal
.
z
,
mirrorPlane
.
constant
);
THREE
.
Water
.
prototype
.
updateTextureMatrix
=
function
()
{
var
projectionMatrix
=
mirrorCamera
.
projectionMatrix
;
this
.
updateMatrixWorld
();
this
.
camera
.
updateMatrixWorld
();
q
.
x
=
(
Math
.
sign
(
clipPlane
.
x
)
+
projectionMatrix
.
elements
[
8
]
)
/
projectionMatrix
.
elements
[
0
];
q
.
y
=
(
Math
.
sign
(
clipPlane
.
y
)
+
projectionMatrix
.
elements
[
9
]
)
/
projectionMatrix
.
elements
[
5
];
q
.
z
=
-
1.0
;
q
.
w
=
(
1.0
+
projectionMatrix
.
elements
[
10
]
)
/
projectionMatrix
.
elements
[
14
];
this
.
mirrorWorldPosition
.
setFromMatrixPosition
(
this
.
matrixWorld
);
this
.
cameraWorldPosition
.
setFromMatrixPosition
(
this
.
camera
.
matrixWorld
);
// Calculate the scaled plane vector
clipPlane
.
multiplyScalar
(
2.0
/
clipPlane
.
dot
(
q
)
);
this
.
rotationMatrix
.
extractRotation
(
this
.
matrixWorld
);
// Replacing the third row of the projection matrix
projectionMatrix
.
elements
[
2
]
=
clipPlane
.
x
;
projectionMatrix
.
elements
[
6
]
=
clipPlane
.
y
;
projectionMatrix
.
elements
[
10
]
=
clipPlane
.
z
+
1.0
-
clipBias
;
projectionMatrix
.
elements
[
14
]
=
clipPlane
.
w
;
this
.
normal
.
set
(
0
,
0
,
1
);
this
.
normal
.
applyMatrix4
(
this
.
rotationMatrix
);
eye
.
setFromMatrixPosition
(
camera
.
matrixWorld
);
var
view
=
this
.
mirrorWorldPosition
.
clone
().
sub
(
this
.
cameraWorldPosition
);
view
.
reflect
(
this
.
normal
).
negate
();
view
.
add
(
this
.
mirrorWorldPosition
);
//
this
.
rotationMatrix
.
extractRotation
(
this
.
camera
.
matrixWorld
);
var
currentRenderTarget
=
renderer
.
getRenderTarget
(
);
this
.
lookAtPosition
.
set
(
0
,
0
,
-
1
);
this
.
lookAtPosition
.
applyMatrix4
(
this
.
rotationMatrix
);
this
.
lookAtPosition
.
add
(
this
.
cameraWorldPosition
);
var
currentVrEnabled
=
renderer
.
vr
.
enabled
;
var
currentShadowAutoUpdate
=
renderer
.
shadowMap
.
autoUpdate
;
var
target
=
this
.
mirrorWorldPosition
.
clone
().
sub
(
this
.
lookAtPosition
);
target
.
reflect
(
this
.
normal
).
negate
();
target
.
add
(
this
.
mirrorWorldPosition
);
scope
.
visible
=
false
;
this
.
up
.
set
(
0
,
-
1
,
0
);
this
.
up
.
applyMatrix4
(
this
.
rotationMatrix
);
this
.
up
.
reflect
(
this
.
normal
).
negate
();
renderer
.
vr
.
enabled
=
false
;
// Avoid camera modification and recursion
renderer
.
shadowMap
.
autoUpdate
=
false
;
// Avoid re-computing shadows
this
.
mirrorCamera
.
position
.
copy
(
view
);
this
.
mirrorCamera
.
up
=
this
.
up
;
this
.
mirrorCamera
.
lookAt
(
target
);
this
.
mirrorCamera
.
aspect
=
this
.
camera
.
aspect
;
renderer
.
render
(
scene
,
mirrorCamera
,
renderTarget
,
true
);
this
.
mirrorCamera
.
updateProjectionMatrix
();
this
.
mirrorCamera
.
updateMatrixWorld
();
scope
.
visible
=
true
;
// Update the texture matrix
this
.
textureMatrix
.
set
(
0.5
,
0.0
,
0.0
,
0.5
,
0.0
,
0.5
,
0.0
,
0.5
,
0.0
,
0.0
,
0.5
,
0.5
,
0.0
,
0.0
,
0.0
,
1.0
);
this
.
textureMatrix
.
multiply
(
this
.
mirrorCamera
.
projectionMatrix
);
this
.
textureMatrix
.
multiply
(
this
.
mirrorCamera
.
matrixWorldInverse
);
renderer
.
vr
.
enabled
=
currentVrEnabled
;
renderer
.
shadowMap
.
autoUpdate
=
currentShadowAutoUpdate
;
// Now update projection matrix with new clip plane, implementing code from: http://www.terathon.com/code/oblique.html
// Paper explaining this technique: http://www.terathon.com/lengyel/Lengyel-Oblique.pdf
this
.
mirrorPlane
.
setFromNormalAndCoplanarPoint
(
this
.
normal
,
this
.
mirrorWorldPosition
);
this
.
mirrorPlane
.
applyMatrix4
(
this
.
mirrorCamera
.
matrixWorldInverse
);
this
.
clipPlane
.
set
(
this
.
mirrorPlane
.
normal
.
x
,
this
.
mirrorPlane
.
normal
.
y
,
this
.
mirrorPlane
.
normal
.
z
,
this
.
mirrorPlane
.
constant
);
var
q
=
new
THREE
.
Vector4
();
var
projectionMatrix
=
this
.
mirrorCamera
.
projectionMatrix
;
renderer
.
setRenderTarget
(
currentRenderTarget
);
q
.
x
=
(
Math
.
sign
(
this
.
clipPlane
.
x
)
+
projectionMatrix
.
elements
[
8
]
)
/
projectionMatrix
.
elements
[
0
];
q
.
y
=
(
Math
.
sign
(
this
.
clipPlane
.
y
)
+
projectionMatrix
.
elements
[
9
]
)
/
projectionMatrix
.
elements
[
5
];
q
.
z
=
-
1.0
;
q
.
w
=
(
1.0
+
projectionMatrix
.
elements
[
10
]
)
/
projectionMatrix
.
elements
[
14
];
// Calculate the scaled plane vector
var
c
=
this
.
clipPlane
.
multiplyScalar
(
2.0
/
this
.
clipPlane
.
dot
(
q
)
);
// Replacing the third row of the projection matrix
projectionMatrix
.
elements
[
2
]
=
c
.
x
;
projectionMatrix
.
elements
[
6
]
=
c
.
y
;
projectionMatrix
.
elements
[
10
]
=
c
.
z
+
1.0
-
this
.
clipBias
;
projectionMatrix
.
elements
[
14
]
=
c
.
w
;
var
worldCoordinates
=
new
THREE
.
Vector3
();
worldCoordinates
.
setFromMatrixPosition
(
this
.
camera
.
matrixWorld
);
this
.
eye
=
worldCoordinates
;
this
.
material
.
uniforms
.
eye
.
value
=
this
.
eye
;
};
};
THREE
.
Water
.
prototype
=
Object
.
create
(
THREE
.
Mesh
.
prototype
);
THREE
.
Water
.
prototype
.
constructor
=
THREE
.
Water
;
examples/js/postprocessing/EffectComposer.js
浏览文件 @
c553f340
...
...
@@ -15,7 +15,7 @@ THREE.EffectComposer = function ( renderer, renderTarget ) {
stencilBuffer
:
false
};
var
size
=
renderer
.
getSize
();
var
size
=
renderer
.
get
DrawingBuffer
Size
();
renderTarget
=
new
THREE
.
WebGLRenderTarget
(
size
.
width
,
size
.
height
,
parameters
);
renderTarget
.
texture
.
name
=
'
EffectComposer.rt1
'
;
...
...
@@ -62,7 +62,7 @@ Object.assign( THREE.EffectComposer.prototype, {
this
.
passes
.
push
(
pass
);
var
size
=
this
.
renderer
.
getSize
();
var
size
=
this
.
renderer
.
get
DrawingBuffer
Size
();
pass
.
setSize
(
size
.
width
,
size
.
height
);
},
...
...
@@ -127,7 +127,7 @@ Object.assign( THREE.EffectComposer.prototype, {
if
(
renderTarget
===
undefined
)
{
var
size
=
this
.
renderer
.
getSize
();
var
size
=
this
.
renderer
.
get
DrawingBuffer
Size
();
renderTarget
=
this
.
renderTarget1
.
clone
();
renderTarget
.
setSize
(
size
.
width
,
size
.
height
);
...
...
examples/js/postprocessing/OutlinePass.js
浏览文件 @
c553f340
...
...
@@ -15,6 +15,7 @@ THREE.OutlinePass = function ( resolution, scene, camera, selectedObjects ) {
this
.
edgeStrength
=
3.0
;
this
.
downSampleRatio
=
2
;
this
.
pulsePeriod
=
0
;
this
.
renderToScreen
=
false
;
THREE
.
Pass
.
call
(
this
);
...
...
@@ -321,6 +322,8 @@ THREE.OutlinePass.prototype = Object.assign( Object.create( THREE.Pass.prototype
this
.
overlayMaterial
.
uniforms
[
"
edgeStrength
"
].
value
=
this
.
edgeStrength
;
this
.
overlayMaterial
.
uniforms
[
"
edgeGlow
"
].
value
=
this
.
edgeGlow
;
this
.
overlayMaterial
.
uniforms
[
"
usePatternTexture
"
].
value
=
this
.
usePatternTexture
;
this
.
overlayMaterial
.
uniforms
[
"
visibleEdgeColor
"
].
value
=
this
.
tempPulseColor1
;
this
.
overlayMaterial
.
uniforms
[
"
hiddenEdgeColor
"
].
value
=
this
.
tempPulseColor2
;
if
(
maskActive
)
renderer
.
context
.
enable
(
renderer
.
context
.
STENCIL_TEST
);
...
...
@@ -367,7 +370,7 @@ THREE.OutlinePass.prototype = Object.assign( Object.create( THREE.Pass.prototype
float depth = unpackRGBAToDepth(texture2DProj( depthTexture, projTexCoord ));
\
float viewZ = -perspectiveDepthToViewZ( depth, cameraNearFar.x, cameraNearFar.y );
\
float depthTest = (-vPosition.z > viewZ) ? 1.0 : 0.0;
\
gl_FragColor = vec4(0.0, depthTest, 1.0,
1
.0);
\
gl_FragColor = vec4(0.0, depthTest, 1.0,
0
.0);
\
}
"
}
);
...
...
@@ -411,7 +414,7 @@ THREE.OutlinePass.prototype = Object.assign( Object.create( THREE.Pass.prototype
float a1 = min(c1.g, c2.g);
\
float a2 = min(c3.g, c4.g);
\
float visibilityFactor = min(a1, a2);
\
vec3 edgeColor = 1.0 - visibilityFactor > 0.001 ? v
isibleEdgeColor : hiddenEdgeColor
;
\
vec3 edgeColor = 1.0 - visibilityFactor > 0.001 ? v
ec3(1,0,0) : vec3(0,1,0)
;
\
gl_FragColor = vec4(edgeColor, 1.0) * vec4(d);
\
}
"
}
);
...
...
@@ -482,7 +485,9 @@ THREE.OutlinePass.prototype = Object.assign( Object.create( THREE.Pass.prototype
"
patternTexture
"
:
{
value
:
null
},
"
edgeStrength
"
:
{
value
:
1.0
},
"
edgeGlow
"
:
{
value
:
1.0
},
"
usePatternTexture
"
:
{
value
:
0.0
}
"
usePatternTexture
"
:
{
value
:
0.0
},
"
visibleEdgeColor
"
:
{
value
:
new
THREE
.
Vector3
(
1.0
,
1.0
,
1.0
)
},
"
hiddenEdgeColor
"
:
{
value
:
new
THREE
.
Vector3
(
1.0
,
1.0
,
1.0
)
},
},
vertexShader
:
...
...
@@ -501,6 +506,8 @@ THREE.OutlinePass.prototype = Object.assign( Object.create( THREE.Pass.prototype
uniform float edgeStrength;
\
uniform float edgeGlow;
\
uniform bool usePatternTexture;
\
uniform vec3 visibleEdgeColor;
\
uniform vec3 hiddenEdgeColor;
\
\
void main() {
\
vec4 edgeValue1 = texture2D(edgeTexture1, vUv);
\
...
...
@@ -508,16 +515,18 @@ THREE.OutlinePass.prototype = Object.assign( Object.create( THREE.Pass.prototype
vec4 maskColor = texture2D(maskTexture, vUv);
\
vec4 patternColor = texture2D(patternTexture, 6.0 * vUv);
\
float visibilityFactor = 1.0 - maskColor.g > 0.0 ? 1.0 : 0.5;
\
vec4 edgeValue = edgeValue1 + edgeValue2 * edgeGlow;
\
vec4 finalColor = edgeStrength * maskColor.r * edgeValue;
\
vec4 edgeValue = edgeStrength * (edgeValue1 + edgeValue2 * edgeGlow);
\
edgeValue.a = max(edgeValue.r, edgeValue.g);
\
vec3 edgeColor = edgeValue.r * visibleEdgeColor + edgeValue.g * hiddenEdgeColor;
\
vec4 finalColor = vec4(edgeColor, edgeValue.a*1.0);
\
if(usePatternTexture)
\
finalColor += + visibilityFactor * (1.0 - maskColor.r) * (1.0 - patternColor.r);
\
gl_FragColor = finalColor;
\
}
"
,
blending
:
THREE
.
Additive
Blending
,
blending
:
THREE
.
Normal
Blending
,
depthTest
:
false
,
depthWrite
:
false
,
transparent
:
true
transparent
:
true
,
}
);
}
...
...
examples/webgl_animation_cloth.html
浏览文件 @
c553f340
...
...
@@ -44,40 +44,6 @@
<script
src=
"js/Cloth.js"
></script>
<script
type=
"x-shader/x-fragment"
id=
"fragmentShaderDepth"
>
#
include
<
packing
>
uniform
sampler2D
texture
;
varying
vec2
vUV
;
void
main
()
{
vec4
pixel
=
texture2D
(
texture
,
vUV
);
if
(
pixel
.
a
<
0.5
)
discard
;
gl_FragData
[
0
]
=
packDepthToRGBA
(
gl_FragCoord
.
z
);
}
</script>
<script
type=
"x-shader/x-vertex"
id=
"vertexShaderDepth"
>
varying
vec2
vUV
;
void
main
()
{
vUV
=
0.75
*
uv
;
vec4
mvPosition
=
modelViewMatrix
*
vec4
(
position
,
1.0
);
gl_Position
=
projectionMatrix
*
mvPosition
;
}
</script>
<script>
/* testing cloth simulation */
...
...
@@ -134,10 +100,7 @@
// camera
camera
=
new
THREE
.
PerspectiveCamera
(
30
,
window
.
innerWidth
/
window
.
innerHeight
,
1
,
10000
);
camera
.
position
.
x
=
1000
;
camera
.
position
.
y
=
50
;
camera
.
position
.
z
=
1500
;
scene
.
add
(
camera
);
camera
.
position
.
set
(
1000
,
50
,
1500
);
// lights
...
...
@@ -145,7 +108,7 @@
scene
.
add
(
new
THREE
.
AmbientLight
(
0x666666
)
);
light
=
new
THREE
.
DirectionalLight
(
0xdfebff
,
1
.75
);
light
=
new
THREE
.
DirectionalLight
(
0xdfebff
,
1
);
light
.
position
.
set
(
50
,
200
,
100
);
light
.
position
.
multiplyScalar
(
1.3
);
...
...
@@ -170,6 +133,8 @@
var
loader
=
new
THREE
.
TextureLoader
();
var
clothTexture
=
loader
.
load
(
'
textures/patterns/circuit_pattern.png
'
);
clothTexture
.
wrapS
=
clothTexture
.
wrapT
=
THREE
.
RepeatWrapping
;
clothTexture
.
offset
.
set
(
0.1
,
0.1
);
clothTexture
.
repeat
.
set
(
0.5
,
0.5
);
clothTexture
.
anisotropy
=
16
;
var
clothMaterial
=
new
THREE
.
MeshPhongMaterial
(
{
...
...
@@ -180,12 +145,8 @@
}
);
// cloth geometry
clothGeometry
=
new
THREE
.
ParametricGeometry
(
clothFunction
,
cloth
.
w
,
cloth
.
h
);
clothGeometry
.
dynamic
=
true
;
var
uniforms
=
{
texture
:
{
value
:
clothTexture
}
};
var
vertexShader
=
document
.
getElementById
(
'
vertexShaderDepth
'
).
textContent
;
var
fragmentShader
=
document
.
getElementById
(
'
fragmentShaderDepth
'
).
textContent
;
clothGeometry
=
new
THREE
.
ParametricGeometry
(
clothFunction
,
cloth
.
w
,
cloth
.
h
);
// cloth mesh
...
...
@@ -194,16 +155,17 @@
object
.
castShadow
=
true
;
scene
.
add
(
object
);
object
.
customDepthMaterial
=
new
THREE
.
ShaderMaterial
(
{
uniforms
:
uniforms
,
vertexShader
:
vertexShader
,
fragmentShader
:
fragmentShader
,
side
:
THREE
.
DoubleSide
object
.
customDepthMaterial
=
new
THREE
.
MeshDepthMaterial
(
{
depthPacking
:
THREE
.
RGBADepthPacking
,
map
:
clothTexture
,
alphaTest
:
0.5
}
);
// sphere
var
ballGeo
=
new
THREE
.
Sphere
Geometry
(
ballSize
,
20
,
20
);
var
ballGeo
=
new
THREE
.
Sphere
BufferGeometry
(
ballSize
,
32
,
16
);
var
ballMaterial
=
new
THREE
.
MeshPhongMaterial
(
{
color
:
0xaaaaaa
}
);
sphere
=
new
THREE
.
Mesh
(
ballGeo
,
ballMaterial
);
...
...
@@ -228,7 +190,7 @@
// poles
var
poleGeo
=
new
THREE
.
BoxGeometry
(
5
,
375
,
5
);
var
poleGeo
=
new
THREE
.
Box
Buffer
Geometry
(
5
,
375
,
5
);
var
poleMat
=
new
THREE
.
MeshPhongMaterial
(
{
color
:
0xffffff
,
specular
:
0x111111
,
shininess
:
100
}
);
var
mesh
=
new
THREE
.
Mesh
(
poleGeo
,
poleMat
);
...
...
@@ -245,14 +207,14 @@
mesh
.
castShadow
=
true
;
scene
.
add
(
mesh
);
var
mesh
=
new
THREE
.
Mesh
(
new
THREE
.
BoxGeometry
(
255
,
5
,
5
),
poleMat
);
var
mesh
=
new
THREE
.
Mesh
(
new
THREE
.
Box
Buffer
Geometry
(
255
,
5
,
5
),
poleMat
);
mesh
.
position
.
y
=
-
250
+
(
750
/
2
);
mesh
.
position
.
x
=
0
;
mesh
.
receiveShadow
=
true
;
mesh
.
castShadow
=
true
;
scene
.
add
(
mesh
);
var
gg
=
new
THREE
.
BoxGeometry
(
10
,
10
,
10
);
var
gg
=
new
THREE
.
Box
Buffer
Geometry
(
10
,
10
,
10
);
var
mesh
=
new
THREE
.
Mesh
(
gg
,
poleMat
);
mesh
.
position
.
y
=
-
250
;
mesh
.
position
.
x
=
125
;
...
...
@@ -285,7 +247,7 @@
var
controls
=
new
THREE
.
OrbitControls
(
camera
,
renderer
.
domElement
);
controls
.
maxPolarAngle
=
Math
.
PI
*
0.5
;
controls
.
minDistance
=
1000
;
controls
.
maxDistance
=
75
00
;
controls
.
maxDistance
=
50
00
;
// performance monitor
...
...
@@ -341,16 +303,13 @@
}
clothGeometry
.
verticesNeedUpdate
=
true
;
clothGeometry
.
computeFaceNormals
();
clothGeometry
.
computeVertexNormals
();
clothGeometry
.
normalsNeedUpdate
=
true
;
clothGeometry
.
verticesNeedUpdate
=
true
;
sphere
.
position
.
copy
(
ballPosition
);
camera
.
lookAt
(
scene
.
position
);
renderer
.
render
(
scene
,
camera
);
}
...
...
examples/webgl_mirror.html
浏览文件 @
c553f340
...
...
@@ -35,7 +35,7 @@
</div>
<script
src=
"../build/three.js"
></script>
<script
src=
"js/Mirror.js"
></script>
<script
src=
"js/
objects/
Mirror.js"
></script>
<script
src=
"js/controls/OrbitControls.js"
></script>
<script>
...
...
examples/webgl_mirror_nodes.html
浏览文件 @
c553f340
...
...
@@ -36,8 +36,8 @@
<script
src=
"../build/three.js"
></script>
<script
src=
"js/libs/dat.gui.min.js"
></script>
<script
src=
"js/Mirror.js"
></script>
<script
src=
"js/MirrorRTT.js"
></script>
<script
src=
"js/
objects/
Mirror.js"
></script>
<script
src=
"js/
objects/
MirrorRTT.js"
></script>
<script
src=
"js/controls/OrbitControls.js"
></script>
<!-- NodeLibrary -->
...
...
examples/webgl_postprocessing_nodes.html
浏览文件 @
c553f340
...
...
@@ -465,12 +465,12 @@
}
);
break
;
case
'
blur
'
:
// PASS
var
size
=
renderer
.
getSize
();
var
size
=
renderer
.
get
DrawingBuffer
Size
();
var
blurScreen
=
new
THREE
.
BlurNode
(
new
THREE
.
ScreenNode
()
);
blurScreen
.
size
=
new
THREE
.
Vector2
(
size
.
width
,
size
.
height
);
...
...
examples/webgl_shaders_ocean.html
浏览文件 @
c553f340
...
...
@@ -33,10 +33,11 @@
<script
src=
"../build/three.js"
></script>
<script
src=
"js/controls/OrbitControls.js"
></script>
<script
src=
"js/
WaterShad
er.js"
></script>
<script
src=
"js/
objects/Wat
er.js"
></script>
<script
src=
"js/Detector.js"
></script>
<script
src=
"js/libs/stats.min.js"
></script>
<script
src=
"js/libs/dat.gui.min.js"
></script>
<script>
...
...
@@ -48,17 +49,14 @@
}
var
container
,
stats
;
var
camera
,
scene
,
renderer
;
var
controls
,
water
,
sphere
;
var
camera
,
scene
,
renderer
,
light
;
var
controls
,
water
,
sphere
,
cubeMap
;
var
parameters
=
{
width
:
2000
,
height
:
2000
,
widthSegments
:
250
,
heightSegments
:
250
,
depth
:
1500
,
param
:
4
,
filterparam
:
1
oceanSide
:
2000
,
size
:
1.0
,
distortionScale
:
3.7
,
alpha
:
1.0
};
var
waterNormals
;
...
...
@@ -80,61 +78,103 @@
//
scene
=
new
THREE
.
Scene
();
scene
.
fog
=
new
THREE
.
FogExp2
(
0xaabbbb
,
0.00
0
1
);
scene
.
fog
=
new
THREE
.
FogExp2
(
0xaabbbb
,
0.001
);
//
camera
=
new
THREE
.
PerspectiveCamera
(
55
,
window
.
innerWidth
/
window
.
innerHeight
,
0.5
,
300
0000
);
camera
.
position
.
set
(
2000
,
750
,
20
00
);
camera
=
new
THREE
.
PerspectiveCamera
(
55
,
window
.
innerWidth
/
window
.
innerHeight
,
1
,
2
0000
);
camera
.
position
.
set
(
30
,
30
,
1
00
);
//
controls
=
new
THREE
.
OrbitControls
(
camera
,
renderer
.
domElement
);
controls
.
enablePan
=
false
;
controls
.
minDistance
=
1000.0
;
controls
.
maxDistance
=
5000.0
;
controls
.
maxPolarAngle
=
Math
.
PI
*
0.495
;
controls
.
target
.
set
(
0
,
500
,
0
);
controls
.
update
();
controls
.
target
.
set
(
0
,
10
,
0
);
controls
.
enablePan
=
false
;
controls
.
minDistance
=
40.0
;
controls
.
maxDistance
=
200.0
;
camera
.
lookAt
(
controls
.
target
);
setLighting
();
//
s
cene
.
add
(
new
THREE
.
AmbientLight
(
0x444444
)
);
s
etWater
(
);
//
var
light
=
new
THREE
.
DirectionalLight
(
0xffffbb
,
1
);
light
.
position
.
set
(
-
1
,
1
,
-
1
);
scene
.
add
(
light
);
setSkybox
();
//
waterNormals
=
new
THREE
.
TextureLoader
().
load
(
'
textures/waternormals.jpg
'
);
waterNormals
.
wrapS
=
waterNormals
.
wrapT
=
THREE
.
RepeatWrapping
;
water
=
new
THREE
.
Water
(
renderer
,
camera
,
scene
,
{
textureWidth
:
512
,
textureHeight
:
512
,
waterNormals
:
waterNormals
,
alpha
:
1.0
,
sunDirection
:
light
.
position
.
clone
().
normalize
(),
sunColor
:
0xffffff
,
waterColor
:
0x001e0f
,
distortionScale
:
50.0
,
fog
:
scene
.
fog
!=
undefined
var
geometry
=
new
THREE
.
IcosahedronGeometry
(
20
,
2
);
for
(
var
i
=
0
,
j
=
geometry
.
faces
.
length
;
i
<
j
;
i
++
)
{
geometry
.
faces
[
i
].
color
.
setHex
(
Math
.
random
()
*
0xffffff
);
}
var
material
=
new
THREE
.
MeshPhongMaterial
(
{
vertexColors
:
THREE
.
FaceColors
,
shininess
:
10
,
envMap
:
cubeMap
,
side
:
THREE
.
DoubleSide
}
);
sphere
=
new
THREE
.
Mesh
(
geometry
,
material
);
sphere
.
castShadow
=
true
;
scene
.
add
(
sphere
);
//
stats
=
new
Stats
();
container
.
appendChild
(
stats
.
dom
);
//
gui
=
new
dat
.
GUI
();
gui
.
add
(
parameters
,
'
distortionScale
'
,
0
,
8
,
0.1
);
gui
.
add
(
parameters
,
'
size
'
,
0.1
,
10
,
0.1
);
gui
.
add
(
parameters
,
'
alpha
'
,
0.9
,
1
,
.
001
);
//
window
.
addEventListener
(
'
resize
'
,
onWindowResize
,
false
);
var
mirrorMesh
=
new
THREE
.
Mesh
(
new
THREE
.
PlaneBufferGeometry
(
parameters
.
width
*
500
,
parameters
.
height
*
500
),
water
.
material
}
function
setWater
()
{
water
=
new
THREE
.
Water
(
parameters
.
oceanSide
*
5
,
parameters
.
oceanSide
*
5
,
{
textureWidth
:
512
,
textureHeight
:
512
,
waterNormals
:
new
THREE
.
TextureLoader
().
load
(
'
textures/waternormals.jpg
'
,
function
(
texture
)
{
texture
.
wrapS
=
texture
.
wrapT
=
THREE
.
RepeatWrapping
;
}),
alpha
:
parameters
.
alpha
,
sunDirection
:
light
.
position
.
clone
().
normalize
(),
sunColor
:
0xffffff
,
waterColor
:
0x001e0f
,
distortionScale
:
parameters
.
distortionScale
,
fog
:
scene
.
fog
!=
undefined
}
);
mirrorMesh
.
add
(
water
);
mirrorMesh
.
rotation
.
x
=
-
Math
.
PI
*
0.5
;
scene
.
add
(
mirrorMesh
);
water
.
rotation
.
x
=
-
Math
.
PI
/
2
;
water
.
receiveShadow
=
true
;
// skybox
scene
.
add
(
water
);
}
var
cubeMap
=
new
THREE
.
CubeTexture
(
[]
);
function
setSkybox
()
{
cubeMap
=
new
THREE
.
CubeTexture
(
[]
);
cubeMap
.
format
=
THREE
.
RGBFormat
;
var
loader
=
new
THREE
.
ImageLoader
();
...
...
@@ -172,44 +212,32 @@
fragmentShader
:
cubeShader
.
fragmentShader
,
vertexShader
:
cubeShader
.
vertexShader
,
uniforms
:
cubeShader
.
uniforms
,
depthWrite
:
false
,
side
:
THREE
.
BackSide
}
);
var
skyBox
=
new
THREE
.
Mesh
(
new
THREE
.
BoxGeometry
(
1000000
,
1000000
,
10000
00
),
new
THREE
.
BoxGeometry
(
parameters
.
oceanSide
*
5
+
100
,
parameters
.
oceanSide
*
5
+
100
,
parameters
.
oceanSide
*
5
+
1
00
),
skyBoxMaterial
);
scene
.
add
(
skyBox
);
//
var
geometry
=
new
THREE
.
IcosahedronGeometry
(
400
,
4
);
for
(
var
i
=
0
,
j
=
geometry
.
faces
.
length
;
i
<
j
;
i
++
)
{
geometry
.
faces
[
i
].
color
.
setHex
(
Math
.
random
()
*
0xffffff
);
}
var
material
=
new
THREE
.
MeshPhongMaterial
(
{
vertexColors
:
THREE
.
FaceColors
,
shininess
:
100
,
envMap
:
cubeMap
}
);
sphere
=
new
THREE
.
Mesh
(
geometry
,
material
);
scene
.
add
(
sphere
);
}
//
function
setLighting
()
{
stats
=
new
Stats
();
container
.
appendChild
(
stats
.
dom
);
renderer
.
shadowMap
.
enabled
=
true
;
//
light
=
new
THREE
.
DirectionalLight
(
0xffffbb
,
1
);
light
.
position
.
set
(
-
30
,
30
,
-
30
);
light
.
castShadow
=
true
;
light
.
shadow
.
camera
.
top
=
45
;
light
.
shadow
.
camera
.
right
=
40
;
light
.
shadow
.
camera
.
left
=
light
.
shadow
.
camera
.
bottom
=
-
40
;
light
.
shadow
.
camera
.
near
=
1
;
light
.
shadow
.
camera
.
far
=
200
;
window
.
addEventListener
(
'
resize
'
,
onWindowResize
,
false
);
scene
.
add
(
light
,
new
THREE
.
AmbientLight
(
0x888888
)
);
}
...
...
@@ -222,8 +250,6 @@
}
//
function
animate
()
{
requestAnimationFrame
(
animate
);
...
...
@@ -236,12 +262,15 @@
var
time
=
performance
.
now
()
*
0.001
;
sphere
.
position
.
y
=
Math
.
sin
(
time
)
*
500
+
250
;
sphere
.
position
.
y
=
Math
.
sin
(
time
)
*
20
+
5
;
sphere
.
rotation
.
x
=
time
*
0.5
;
sphere
.
rotation
.
z
=
time
*
0.51
;
water
.
material
.
uniforms
.
time
.
value
+=
1.0
/
60.0
;
water
.
render
();
water
.
material
.
uniforms
.
size
.
value
=
parameters
.
size
;
water
.
material
.
uniforms
.
distortionScale
.
value
=
parameters
.
distortionScale
;
water
.
material
.
uniforms
.
alpha
.
value
=
parameters
.
alpha
;
renderer
.
render
(
scene
,
camera
);
}
...
...
examples/webgl_shaders_sky.html
浏览文件 @
c553f340
...
...
@@ -44,7 +44,7 @@
<script
src=
"../build/three.js"
></script>
<script
src=
"js/controls/OrbitControls.js"
></script>
<script
src=
"js/
SkyShader
.js"
></script>
<script
src=
"js/
objects/Sky
.js"
></script>
<script
src=
"js/Detector.js"
></script>
<script
src=
"js/libs/dat.gui.min.js"
></script>
...
...
@@ -65,9 +65,10 @@
function
initSky
()
{
// Add Sky
Mesh
// Add Sky
sky
=
new
THREE
.
Sky
();
scene
.
add
(
sky
.
mesh
);
sky
.
scale
.
setScalar
(
450000
);
scene
.
add
(
sky
);
// Add Sun Helper
sunSphere
=
new
THREE
.
Mesh
(
...
...
@@ -95,7 +96,7 @@
function
guiChanged
()
{
var
uniforms
=
sky
.
uniforms
;
var
uniforms
=
sky
.
material
.
uniforms
;
uniforms
.
turbidity
.
value
=
effectController
.
turbidity
;
uniforms
.
rayleigh
.
value
=
effectController
.
rayleigh
;
uniforms
.
luminance
.
value
=
effectController
.
luminance
;
...
...
@@ -111,7 +112,7 @@
sunSphere
.
visible
=
effectController
.
sun
;
sky
.
uniforms
.
sunPosition
.
value
.
copy
(
sunSphere
.
position
);
uniforms
.
sunPosition
.
value
.
copy
(
sunSphere
.
position
);
renderer
.
render
(
scene
,
camera
);
...
...
examples/webvr_sandbox.html
浏览文件 @
c553f340
...
...
@@ -19,7 +19,7 @@
<script
src=
"js/vr/WebVR.js"
></script>
<script
src=
"js/Mirror.js"
></script>
<script
src=
"js/
objects/
Mirror.js"
></script>
<script>
...
...
src/core/BufferGeometry.js
浏览文件 @
c553f340
...
...
@@ -39,8 +39,6 @@ function BufferGeometry() {
}
BufferGeometry
.
MaxIndex
=
65535
;
Object
.
assign
(
BufferGeometry
.
prototype
,
EventDispatcher
.
prototype
,
{
isBufferGeometry
:
true
,
...
...
src/core/Object3D.js
浏览文件 @
c553f340
...
...
@@ -591,8 +591,8 @@ Object.assign( Object3D.prototype, EventDispatcher.prototype, {
toJSON
:
function
(
meta
)
{
// meta is
''
when called from JSON.stringify
var
isRootObject
=
(
meta
===
undefined
||
meta
===
'
'
);
// meta is
a string
when called from JSON.stringify
var
isRootObject
=
(
meta
===
undefined
||
typeof
meta
===
'
string
'
);
var
output
=
{};
...
...
src/loaders/MaterialLoader.js
浏览文件 @
c553f340
...
...
@@ -82,6 +82,13 @@ Object.assign( MaterialLoader.prototype, {
if
(
json
.
wireframeLinecap
!==
undefined
)
material
.
wireframeLinecap
=
json
.
wireframeLinecap
;
if
(
json
.
wireframeLinejoin
!==
undefined
)
material
.
wireframeLinejoin
=
json
.
wireframeLinejoin
;
if
(
json
.
rotation
!==
undefined
)
material
.
rotation
=
json
.
rotation
;
if
(
json
.
linewidth
!==
1
)
material
.
linewidth
=
json
.
linewidth
;
if
(
json
.
dashSize
!==
undefined
)
material
.
dashSize
=
json
.
dashSize
;
if
(
json
.
gapSize
!==
undefined
)
material
.
gapSize
=
json
.
gapSize
;
if
(
json
.
scale
!==
undefined
)
material
.
scale
=
json
.
scale
;
if
(
json
.
skinning
!==
undefined
)
material
.
skinning
=
json
.
skinning
;
if
(
json
.
morphTargets
!==
undefined
)
material
.
morphTargets
=
json
.
morphTargets
;
if
(
json
.
dithering
!==
undefined
)
material
.
dithering
=
json
.
dithering
;
...
...
src/materials/Material.js
浏览文件 @
c553f340
...
...
@@ -131,7 +131,7 @@ Object.assign( Material.prototype, EventDispatcher.prototype, {
toJSON
:
function
(
meta
)
{
var
isRoot
=
meta
===
undefined
;
var
isRoot
=
(
meta
===
undefined
||
typeof
meta
===
'
string
'
)
;
if
(
isRoot
)
{
...
...
@@ -162,6 +162,8 @@ Object.assign( Material.prototype, EventDispatcher.prototype, {
if
(
this
.
metalness
!==
undefined
)
data
.
metalness
=
this
.
metalness
;
if
(
this
.
emissive
&&
this
.
emissive
.
isColor
)
data
.
emissive
=
this
.
emissive
.
getHex
();
if
(
this
.
emissiveIntensity
!==
1
)
data
.
emissiveIntensity
=
this
.
emissiveIntensity
;
if
(
this
.
specular
&&
this
.
specular
.
isColor
)
data
.
specular
=
this
.
specular
.
getHex
();
if
(
this
.
shininess
!==
undefined
)
data
.
shininess
=
this
.
shininess
;
if
(
this
.
clearCoat
!==
undefined
)
data
.
clearCoat
=
this
.
clearCoat
;
...
...
@@ -223,6 +225,14 @@ Object.assign( Material.prototype, EventDispatcher.prototype, {
data
.
depthTest
=
this
.
depthTest
;
data
.
depthWrite
=
this
.
depthWrite
;
// rotation (SpriteMaterial)
if
(
this
.
rotation
!==
0
)
data
.
rotation
=
this
.
rotation
;
if
(
this
.
linewidth
!==
1
)
data
.
linewidth
=
this
.
linewidth
;
if
(
this
.
dashSize
!==
undefined
)
data
.
dashSize
=
this
.
dashSize
;
if
(
this
.
gapSize
!==
undefined
)
data
.
gapSize
=
this
.
gapSize
;
if
(
this
.
scale
!==
undefined
)
data
.
scale
=
this
.
scale
;
if
(
this
.
dithering
===
true
)
data
.
dithering
=
true
;
if
(
this
.
alphaTest
>
0
)
data
.
alphaTest
=
this
.
alphaTest
;
...
...
src/renderers/WebGLRenderer.js
浏览文件 @
c553f340
...
...
@@ -24,7 +24,6 @@ import { WebGLProperties } from './webgl/WebGLProperties.js';
import
{
WebGLState
}
from
'
./webgl/WebGLState.js
'
;
import
{
WebGLCapabilities
}
from
'
./webgl/WebGLCapabilities.js
'
;
import
{
WebVRManager
}
from
'
./webvr/WebVRManager.js
'
;
import
{
BufferGeometry
}
from
'
../core/BufferGeometry.js
'
;
import
{
WebGLExtensions
}
from
'
./webgl/WebGLExtensions.js
'
;
import
{
Vector3
}
from
'
../math/Vector3.js
'
;
import
{
WebGLClipping
}
from
'
./webgl/WebGLClipping.js
'
;
...
...
@@ -258,14 +257,9 @@ function WebGLRenderer( parameters ) {
extensions
.
get
(
'
OES_texture_half_float
'
);
extensions
.
get
(
'
OES_texture_half_float_linear
'
);
extensions
.
get
(
'
OES_standard_derivatives
'
);
extensions
.
get
(
'
OES_element_index_uint
'
);
extensions
.
get
(
'
ANGLE_instanced_arrays
'
);
if
(
extensions
.
get
(
'
OES_element_index_uint
'
)
)
{
BufferGeometry
.
MaxIndex
=
4294967296
;
}
utils
=
new
WebGLUtils
(
_gl
,
extensions
);
capabilities
=
new
WebGLCapabilities
(
_gl
,
extensions
,
parameters
);
...
...
src/renderers/shaders/ShaderChunk/bsdfs.glsl
浏览文件 @
c553f340
...
...
@@ -191,7 +191,7 @@ vec3 LTC_Evaluate( const in vec3 N, const in vec3 V, const in vec3 P, const in m
T2
=
-
cross
(
N
,
T1
);
// negated from paper; possibly due to a different assumed handedness of world coordinate system
// compute transform
mat3
mat
=
mInv
*
transpose
(
mat3
(
T1
,
T2
,
N
)
);
mat3
mat
=
mInv
*
transpose
Mat3
(
mat3
(
T1
,
T2
,
N
)
);
// transform rect
vec3
coords
[
4
];
...
...
src/renderers/shaders/ShaderChunk/common.glsl
浏览文件 @
c553f340
...
...
@@ -73,12 +73,13 @@ vec3 linePlaneIntersect( in vec3 pointOnLine, in vec3 lineDirection, in vec3 poi
}
mat3
transpose
(
const
in
mat3
v
)
{
mat3
transpose
Mat3
(
const
in
mat3
m
)
{
mat3
tmp
;
tmp
[
0
]
=
vec3
(
v
[
0
].
x
,
v
[
1
].
x
,
v
[
2
].
x
);
tmp
[
1
]
=
vec3
(
v
[
0
].
y
,
v
[
1
].
y
,
v
[
2
].
y
);
tmp
[
2
]
=
vec3
(
v
[
0
].
z
,
v
[
1
].
z
,
v
[
2
].
z
);
tmp
[
0
]
=
vec3
(
m
[
0
].
x
,
m
[
1
].
x
,
m
[
2
].
x
);
tmp
[
1
]
=
vec3
(
m
[
0
].
y
,
m
[
1
].
y
,
m
[
2
].
y
);
tmp
[
2
]
=
vec3
(
m
[
0
].
z
,
m
[
1
].
z
,
m
[
2
].
z
);
return
tmp
;
...
...
src/textures/Texture.js
浏览文件 @
c553f340
...
...
@@ -126,7 +126,9 @@ Object.assign( Texture.prototype, EventDispatcher.prototype, {
toJSON
:
function
(
meta
)
{
if
(
meta
.
textures
[
this
.
uuid
]
!==
undefined
)
{
var
isRootObject
=
(
meta
===
undefined
||
typeof
meta
===
'
string
'
);
if
(
!
isRootObject
&&
meta
.
textures
[
this
.
uuid
]
!==
undefined
)
{
return
meta
.
textures
[
this
.
uuid
];
...
...
@@ -210,7 +212,7 @@ Object.assign( Texture.prototype, EventDispatcher.prototype, {
}
if
(
meta
.
images
[
image
.
uuid
]
===
undefined
)
{
if
(
!
isRootObject
&&
meta
.
images
[
image
.
uuid
]
===
undefined
)
{
meta
.
images
[
image
.
uuid
]
=
{
uuid
:
image
.
uuid
,
...
...
@@ -223,7 +225,11 @@ Object.assign( Texture.prototype, EventDispatcher.prototype, {
}
meta
.
textures
[
this
.
uuid
]
=
output
;
if
(
!
isRootObject
)
{
meta
.
textures
[
this
.
uuid
]
=
output
;
}
return
output
;
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录