three实现三维球灯装饰品旋转动画效果代码
代码语言:html
所属分类:三维
代码描述:three实现三维球灯装饰品旋转动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> * { margin: 0; padding: 0; } canvas { position: fixed; width: 100%; height: 100%; top: 0; left: 0; margin: 0; padding: 0; } </style> </head> <body> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.144.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/OrbitControls.144.js"></script> <script > !function () { "use strict"; let e,t,n,o,i,a,r,d,s,E = 5,w = .05,l = 1,c = .92,u = ""; function h(e, t, n, o, a, d = "") { i = new THREE.IcosahedronGeometry(t, o); let s = new THREE.Vector3(),E = s.clone(); s.fromBufferAttribute(i.getAttribute("position"), 0), E.fromBufferAttribute(i.getAttribute("position"), 1); var w = s.distanceTo(E); d = "random" == d ? new THREE.Color(16777215 * Math.random()) : d ? new THREE.Color(d) : 16777215; let l = new THREE.Mesh(new THREE.TorusGeometry(w, n, 50, 50), new THREE.MeshStandardMaterial({ color: d, metalness: .5, roughness: .3 })); l.castShadow = !0, l.receiveShadow = !0; let c = []; for (let e = 0; e < i.attributes.position.count; e++) { let t = new THREE.Vector3(); t.fromBufferAttribute(i.getAttribute("position"), e), c.push([t.x, t.y, t.z]); } c = [...new Set(c.map(JSON.stringify))].map(JSON.parse); for (let t = 0; t < c.length; t++) { let n = new THREE.Vector3(c[t][0], c[t][1], c[t][2]); r = l.clone(), n.multiplyScalar(a), r.position.set(n.x, n.y, n.z), r.lookAt(0, 0, 0), e.add(r); } } function R() { e.aspect = window.innerWidth / window.innerHeight, e.updateProjectionMatrix(), n.setSi.........完整代码请登录后点击上方下载按钮下载查看
网友评论0