LUME.unversioned三维镜头旋转效果代码
代码语言:html
所属分类:三维
代码描述:LUME.unversioned三维镜头旋转效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> html, body { width: 100%; height: 100%; margin: 0; background: black; } lume-scene { touch-action: none; } </style> </head> <body > <!-- Made with LUME http://github.com/lume/lume (Working towards an initial release!) --> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/LUME.unversioned.7.js"></script> <!-- ABOUT: This demo show how to make a camera rig for rotating a camera around an object. --> <lume-scene id="scene" perspective="800" webgl enable-css="false"> <!-- Camera Rig --> <lume-node id="controls" size="1 1 1" rotation="0 30 0" size-mode="proportional proportional proportional"> <lume-node id="xRotator" size="1 1 1" rotation="40 0 0" size-mode="proportional proportional proportional"> <lume-perspective-camera id="cam" active position="0 0 1000" align="0.5 0.5 0.5"></lume-perspective-camera> </lume-node> </lume-node> <lume-node id="lights" align="0.5 0.5 0.5" rotation="0 30 0"> <lume-point-light color="yellow" position="500 0 0" intensity="0.7"> <lume-sphere has="basic-material" color="yellow" opacity="0.5" mount-point="0.5 0.5 0.5" size="10 10 10" cast-shadow="false" receive-shadow="false"></lume-sphere> </lume-point-light> <lume-point-light color="deeppink" position="-500 0 0" intensity="0.7"> <lume-sphere has="basic-material" color="deeppink" opacity="0.5" mount-point="0.5 0.5 0.5" size="10 10 10" cast-shadow="false" receive-shadow="false"></lume-sphere> </lume-point-light> <lume-point-light color="cyan" position="0 0 500" intensity="0.7"> <lume-sphere has="basic-material" color="cyan" opacity="0.5" mount-point="0.5 0.5 0.5" size="10 10 10" cast-shadow="false" receive-shadow="false"></lume-sphere> </lume-point-light> <lume-point-light color="limegreen" position="0 0 -500" intensity="0.7"> <lume-sphere has="basic-material" color="limegreen" opacity="0.5" mount-point="0.5 0.5 0.5" size="10 10 10" cast-shadow="false" receive-shadow="false"></lume-sphere> </lume-point-light> <lume-point-light color="white" position="0 -500 0" intensity="0.7"> <lume-sphere has="basic-material" color="white" opacity=&quo.........完整代码请登录后点击上方下载按钮下载查看
网友评论0