Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
cqiang1993
AR.js
提交
b8286b1f
A
AR.js
项目概览
cqiang1993
/
AR.js
与 Fork 源项目一致
从无法访问的项目Fork
通知
2
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
A
AR.js
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
b8286b1f
编写于
3月 19, 2017
作者:
J
Jerome Etienne
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
added animation to holographic message
上级
b8e77ee0
变更
2
显示空白变更内容
内联
并排
Showing
2 changed file
with
40 addition
and
3 deletion
+40
-3
three.js/examples/holographic-message.html
three.js/examples/holographic-message.html
+36
-3
three.js/examples/markercloak.html
three.js/examples/markercloak.html
+4
-0
未找到文件。
three.js/examples/holographic-message.html
浏览文件 @
b8286b1f
...
@@ -49,7 +49,7 @@
...
@@ -49,7 +49,7 @@
gl_FragColor
.
rgb
*=
vec3
(
0.0
,
1.0
,
1.0
);
gl_FragColor
.
rgb
*=
vec3
(
0.0
,
1.0
,
1.0
);
// silly glow
// silly glow
gl_FragColor
.
rgb
*=
2
.0
;
gl_FragColor
.
rgb
*=
1
.0
;
// do a interlace effect
// do a interlace effect
float
offset
=
sin
(
time
/
3.0
);
float
offset
=
sin
(
time
/
3.0
);
...
@@ -206,7 +206,7 @@
...
@@ -206,7 +206,7 @@
value
:
0.0
value
:
0.0
},
},
opacity
:
{
opacity
:
{
value
:
1.0
value
:
0.5
},
},
tDiffuse
:
{
tDiffuse
:
{
value
:
videoTexture
value
:
videoTexture
...
@@ -240,6 +240,8 @@
...
@@ -240,6 +240,8 @@
//////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////
// Code Separator
// Code Separator
//////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////
;(
function
(){
var
canvas
=
document
.
createElement
(
'
canvas
'
);
var
canvas
=
document
.
createElement
(
'
canvas
'
);
canvas
.
width
=
256
;
canvas
.
width
=
256
;
canvas
.
height
=
256
;
canvas
.
height
=
256
;
...
@@ -274,7 +276,7 @@
...
@@ -274,7 +276,7 @@
var
material
=
new
THREE
.
MeshBasicMaterial
({
var
material
=
new
THREE
.
MeshBasicMaterial
({
map
:
texture
,
map
:
texture
,
transparent
:
true
,
transparent
:
true
,
opacity
:
0.5
,
opacity
:
0.
7
5
,
color
:
'
cyan
'
,
color
:
'
cyan
'
,
side
:
THREE
.
DoubleSide
side
:
THREE
.
DoubleSide
});
});
...
@@ -297,7 +299,38 @@
...
@@ -297,7 +299,38 @@
onRenderFcts
.
push
(
function
(
delta
){
onRenderFcts
.
push
(
function
(
delta
){
ringHighMesh
.
rotation
.
z
-=
2
*
Math
.
PI
*
delta
/
5
ringHighMesh
.
rotation
.
z
-=
2
*
Math
.
PI
*
delta
/
5
})
})
})()
//////////////////////////////////////////////////////////////////////////////
// opacity animation
//////////////////////////////////////////////////////////////////////////////
// animation opacity
var
minScale
=
0.001
var
targetScale
=
new
THREE
.
Vector3
(
minScale
,
minScale
,
minScale
)
onRenderFcts
.
push
(
function
(
delta
){
var
ratio
=
0.2
containerMesh
.
scale
.
x
=
containerMesh
.
scale
.
x
*
(
1
-
ratio
)
+
targetScale
.
x
*
ratio
containerMesh
.
scale
.
y
=
containerMesh
.
scale
.
y
*
(
1
-
ratio
)
+
targetScale
.
y
*
ratio
containerMesh
.
scale
.
z
=
containerMesh
.
scale
.
z
*
(
1
-
ratio
)
+
targetScale
.
z
*
ratio
if
(
Math
.
abs
(
containerMesh
.
scale
.
x
-
minScale
)
<=
0.001
){
containerMesh
.
visible
=
false
}
else
{
containerMesh
.
visible
=
true
}
})
// toggleCloak on click/keypress
function
toggleCloak
(){
if
(
targetScale
.
x
===
1.0
){
targetScale
.
set
(
minScale
,
minScale
,
minScale
)
}
else
{
targetScale
.
set
(
1
,
1
,
1
)
}
}
document
.
body
.
addEventListener
(
'
click
'
,
toggleCloak
)
document
.
body
.
addEventListener
(
'
keypress
'
,
toggleCloak
)
//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////
// render the whole thing on the page
// render the whole thing on the page
//////////////////////////////////////////////////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////
...
...
three.js/examples/markercloak.html
浏览文件 @
b8286b1f
...
@@ -170,6 +170,10 @@
...
@@ -170,6 +170,10 @@
})
})
}
}
//////////////////////////////////////////////////////////////////////////////
// opacity animation
//////////////////////////////////////////////////////////////////////////////
// animation opacity
// animation opacity
var
targetOpacity
=
0.0
var
targetOpacity
=
0.0
onRenderFcts
.
push
(
function
(
delta
){
onRenderFcts
.
push
(
function
(
delta
){
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录