three编写一个三维通用效能模型旋转动画效果代码
代码语言:html
所属分类:三维
代码描述:three编写一个三维通用效能模型旋转动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> html, body { margin: 0; height: 100%; } #c { width: 100%; height: 100%; display: block; } </style> </head> <body translate="no" > <canvas id="c"></canvas> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.121.js"></script> <script> const canvas = document.querySelector("#c"); const renderer = new THREE.WebGL1Renderer({ canvas }); const fov = 75, aspect = 2, near = 0.1, far = 5, camera = new THREE.PerspectiveCamera(fov, aspect, near, far); camera.position.z = 4; const scene = new THREE.Scene(); scene.background = new THREE.Color("#FFCCCC"); const gemRadius = 0.6; const gemGeometry = new THREE.IcosahedronBufferGeometry(gemRadius); const gemMaterial = new THREE.MeshStandardMaterial({ color: 0x6699ff, emissive: 0x83a5ff, roughness: 0.8, metalness: 1 }); const gem = new THREE.Mesh(gemGeometry, gemMaterial); scene.add(gem); const radius = 1; const detail = 1; const geometry = new THREE.IcosahedronBufferGeometry(radius, detail); const material = new THREE.MeshBasicMaterial({ color: 0xffffff, wireframe: true, wireframeLinewidth: 1 }); const object = new THREE.Mesh(geometry, material); scene.add(object); //ライト function makePointLight(color, intense, dist, decay) { const po.........完整代码请登录后点击上方下载按钮下载查看
网友评论0