three实现三维三角形变形旋转艺术效果代码果代码
代码语言:html
所属分类:三维
代码描述:three实现三维三角形变形旋转艺术效果代码果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> html, body { margin: 0; padding: 0; width: 100%; height: 100%; } canvas { position: fixed; width: 100%; height: 100%; z-index: -1; } </style> </head> <body> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.109.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/TweenMax.min.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/randomColor.js"></script> <script src='https://klevron.github.io/codepen/three.js/OrbitControls.js'></script> <script id="rendered-js"> var scene, camera, cameraCtrl, renderer; const nbTrucs = 1; const nbObjects = 25,objectMinRadius = 1,objectRadiusCoef = 1.5,objectThickness = 0.5,objectDepth = 0.5; const animationDuration = 9,animationDelay = 0.1; function init() { scene = new THREE.Scene(); camera = new THREE.PerspectiveCamera(30, window.innerWidth / window.innerHeight, 0.1, 1000); cameraCtrl = new THREE.OrbitControls(camera); // cameraCtrl.autoRotate = true; // cameraCtrl.autoRotateSpeed = 5; renderer = new THREE.WebGLRenderer({ antialias: true }); renderer.setSize(window.innerWidth, window.innerHeight); document.body.appendChild(renderer.domElement); initScene(); onWindowResize(); window.addEventListener('resize', onWindowResize, false); animate(); }; function initScene() { scene = new THREE.Scene(); scene.background = new THREE.Color(0x000000); this.initLights(); camera.position.z = 75; for (var i = 0; i < nbTrucs; i++) { var truc = new Truc(); scene.add(truc.o3d); } } function initLights() { const lightIntensity = 0.5; const lightDistance = 200; scene.add(new THREE.AmbientLight(0xeeeeee)); var light; light = new THREE.PointLight(randomColor({ luminosity: 'light' }), lightIntensity, lightDistance); light.position.set(0, 100, 0); scene.add(light); light = new THREE.PointLight(randomColor({ luminosity: 'light' }), lightIntensity, lightDistance); light.position.set(0, -100, 0); scene.add(light); light = new THREE.PointLight(randomColor({ luminosity: 'light' }), l.........完整代码请登录后点击上方下载按钮下载查看
网友评论0