Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
车家大少爷
three.js
提交
d45565bf
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,发现更多精彩内容 >>
提交
d45565bf
编写于
4月 29, 2017
作者:
M
Mugen87
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
Examples: Clean up
上级
d57cbd58
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
66 addition
and
68 deletion
+66
-68
examples/webgl_lights_rectarealight.html
examples/webgl_lights_rectarealight.html
+66
-68
未找到文件。
examples/webgl_lights_rectarealight.html
浏览文件 @
d45565bf
...
...
@@ -42,9 +42,9 @@
<script
src=
"../build/three.js"
></script>
<script
src=
"js/lights/RectAreaLightUniformsLib.js"
></script>
<script
src=
"
../examples/
js/libs/dat.gui.min.js"
></script>
<script
src=
"
../examples/js/controls/OrbitControls
.js"
></script>
<script
src=
"js/controls/OrbitControls.js"
></script>
<script
src=
"js/libs/dat.gui.min.js"
></script>
<script
src=
"
js/libs/stats.min
.js"
></script>
<script
src=
"js/Detector.js"
></script>
<script>
...
...
@@ -53,11 +53,11 @@
if
(
!
Detector
.
webgl
)
Detector
.
addGetWebGLMessage
();
var
r
nd
=
new
THREE
.
WebGLRenderer
();
var
cam
=
new
THREE
.
PerspectiveCamera
(
45
,
window
.
innerWidth
/
window
.
innerHeight
,
1
,
1
000
);
var
orb
=
new
THREE
.
OrbitControls
(
cam
,
rnd
.
domElement
);
var
r
enderer
=
new
THREE
.
WebGLRenderer
();
var
cam
era
=
new
THREE
.
PerspectiveCamera
(
34
,
window
.
innerWidth
/
window
.
innerHeight
,
0.1
,
20
000
);
var
controls
=
new
THREE
.
OrbitControls
(
camera
,
renderer
.
domElement
);
var
sc
n
=
new
THREE
.
Scene
();
var
sc
ene
=
new
THREE
.
Scene
();
var
origin
=
new
THREE
.
Object3D
();
var
matStdParams
=
{
...
...
@@ -84,35 +84,46 @@
var
rectLightHelper
;
var
ray
=
new
THREE
.
Raycaster
();
var
mouseDown
=
new
THREE
.
Vector2
();
var
mouse
=
new
THREE
.
Vector2
();
var
gui
,
guiElements
;
var
param
=
{};
var
stats
;
init
();
animate
();
function
init
()
{
var
gl
=
r
nd
.
context
;
var
gl
=
r
enderer
.
context
;
// Check for float-RT support
// TODO (abelnation): figure out fall-back for float textures
if
(
!
gl
.
getExtension
(
"
OES_texture_float
"
))
{
alert
(
"
OES_texture_float not supported
"
);
throw
"
missing webgl extension
"
;
if
(
!
gl
.
getExtension
(
'
OES_texture_float
'
)
)
{
alert
(
'
OES_texture_float not supported
'
);
throw
'
missing webgl extension
'
;
}
if
(
!
gl
.
getExtension
(
"
OES_texture_float_linear
"
))
{
alert
(
"
OES_texture_float_linear not supported
"
);
throw
"
missing webgl extension
"
;
if
(
!
gl
.
getExtension
(
'
OES_texture_float_linear
'
)
)
{
alert
(
'
OES_texture_float_linear not supported
'
);
throw
'
missing webgl extension
'
;
}
rnd
.
shadowMap
.
enabled
=
true
;
rnd
.
shadowMap
.
type
=
THREE
.
PCFSoftShadowMap
;
rnd
.
gammaInput
=
true
;
rnd
.
gammaOutput
=
true
;
rnd
.
antialias
=
true
;
renderer
.
setSize
(
window
.
innerWidth
,
window
.
innerHeight
);
renderer
.
shadowMap
.
enabled
=
true
;
renderer
.
shadowMap
.
type
=
THREE
.
PCFSoftShadowMap
;
renderer
.
gammaInput
=
true
;
renderer
.
gammaOutput
=
true
;
renderer
.
antialias
=
true
;
document
.
body
.
appendChild
(
renderer
.
domElement
);
stats
=
new
Stats
();
document
.
body
.
appendChild
(
stats
.
dom
);
cam
.
position
.
set
(
0
,
20
,
45
);
cam
era
.
position
.
set
(
0
,
20
,
45
);
rectLight
=
new
THREE
.
RectAreaLight
(
0xffffff
,
100
,
10
,
10
);
rectLight
.
position
.
set
(
5
,
5
,
0
);
...
...
@@ -120,12 +131,12 @@
// TODO: ensure RectAreaLight handles target param correctly
rectLightHelper
=
new
THREE
.
RectAreaLightHelper
(
rectLight
);
sc
n
.
add
(
rectLightHelper
);
sc
ene
.
add
(
rectLightHelper
);
// TODO (abelnation): rect light shadow
sc
n
.
add
(
cam
);
sc
n
.
add
(
origin
);
sc
ene
.
add
(
camera
);
sc
ene
.
add
(
origin
);
matStdFloor
.
color
.
set
(
0x808080
);
matStdObjects
.
color
.
set
(
0xA00000
);
...
...
@@ -137,27 +148,23 @@
mshStdSphere
.
castShadow
=
true
;
mshStdSphere
.
receiveShadow
=
true
;
mshStdSphere
.
position
.
set
(
-
5
,
5
,
0
);
mshStdSphere
.
position
.
set
(
-
5
,
5
,
0
);
mshStdKnot
.
position
.
set
(
5
,
5
,
0
);
mshStdKnot
.
castShadow
=
true
;
mshStdKnot
.
receiveShadow
=
true
;
sc
n
.
add
(
mshStdFloor
);
sc
n
.
add
(
mshStdBox
);
sc
n
.
add
(
mshStdSphere
);
sc
n
.
add
(
mshStdKnot
);
sc
n
.
add
(
amb
);
sc
ene
.
add
(
mshStdFloor
);
sc
ene
.
add
(
mshStdBox
);
sc
ene
.
add
(
mshStdSphere
);
sc
ene
.
add
(
mshStdKnot
);
scene
.
add
(
amb
);
sc
ene
.
add
(
rectLight
);
scn
.
add
(
rectLight
);
controls
.
target
.
copy
(
mshStdBox
.
position
);
controls
.
update
();
document
.
body
.
appendChild
(
rnd
.
domElement
);
onResize
();
orb
.
target
.
copy
(
mshStdBox
.
position
);
orb
.
update
();
buildGui
();
window
.
addEventListener
(
'
resize
'
,
onResize
,
false
);
...
...
@@ -165,20 +172,26 @@
function
onResize
()
{
r
nd
.
setSize
(
window
.
innerWidth
,
window
.
innerHeight
);
cam
.
aspect
=
(
window
.
innerWidth
/
window
.
innerHeight
);
cam
.
updateProjectionMatrix
();
r
enderer
.
setSize
(
window
.
innerWidth
,
window
.
innerHeight
);
cam
era
.
aspect
=
(
window
.
innerWidth
/
window
.
innerHeight
);
cam
era
.
updateProjectionMatrix
();
}
function
tick
()
{
function
animate
()
{
requestAnimationFrame
(
animate
);
if
(
param
.
motion
)
{
if
(
param
.
motion
)
update
();
rectLightHelper
.
update
();
}
render
(
);
render
er
.
render
(
scene
,
camera
);
requestAnimationFrame
(
tick
);
stats
.
update
(
);
}
...
...
@@ -208,22 +221,11 @@
}
function
clearGui
()
{
if
(
gui
)
gui
.
destroy
();
gui
=
new
dat
.
GUI
();
var
gStyle
=
gui
.
domElement
.
style
;
gStyle
.
position
=
"
absolute
"
;
gStyle
.
top
=
"
48px
"
;
gui
.
open
();
}
function
buildGui
()
{
clearGui
();
var
gui
=
new
dat
.
GUI
(
{
width
:
300
}
);
gui
.
open
();
param
=
{
motion
:
true
,
...
...
@@ -261,13 +263,13 @@
}
);
lightFolder
.
add
(
param
,
'
intensity
'
,
0.0
,
400
.0
).
onChange
(
function
(
val
)
{
lightFolder
.
add
(
param
,
'
intensity
'
,
0.0
,
400
).
onChange
(
function
(
val
)
{
rectLight
.
intensity
=
val
;
}
);
lightFolder
.
add
(
param
,
'
ambient
'
,
0.0
,
0.05
).
onChange
(
function
(
val
)
{
lightFolder
.
add
(
param
,
'
ambient
'
,
0.0
,
1
).
step
(
0.01
).
onChange
(
function
(
val
)
{
amb
.
intensity
=
val
;
...
...
@@ -289,7 +291,7 @@
}
);
standardFolder
.
add
(
param
,
'
roughness
'
,
0.0
,
1.0
).
onChange
(
function
(
val
)
{
standardFolder
.
add
(
param
,
'
roughness
'
,
0.0
,
1.0
).
step
(
0.01
).
onChange
(
function
(
val
)
{
matStdObjects
.
roughness
=
val
;
matStdFloor
.
roughness
=
val
;
...
...
@@ -297,7 +299,7 @@
}
);
// TODO (abelnation): use env map to reflect metal property
standardFolder
.
add
(
param
,
'
metalness
'
,
0.0
,
1.0
).
onChange
(
function
(
val
)
{
standardFolder
.
add
(
param
,
'
metalness
'
,
0.0
,
1.0
).
step
(
0.01
).
onChange
(
function
(
val
)
{
matStdObjects
.
metalness
=
val
;
matStdFloor
.
metalness
=
val
;
...
...
@@ -311,10 +313,6 @@
}
init
();
buildGui
();
tick
();
</script>
</body>
</html>
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录