threes实现一个奥运冰墩墩三维吉祥物效果代码
代码语言:html
所属分类:三维
代码描述:threes实现一个奥运冰墩墩三维吉祥物效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> html, body { height: 100%; margin: 0; } #c { width: 100%; height: 100%; display: block; } </style> </head> <body> <!-- three.min.js r87 --> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.133.js"></script> <!-- GLTFLoader.js --> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/GLTFLoader.133.js"></script> <canvas id="c"></canvas> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/OrbitControls.133.js"></script> <script> 'use strict'; function deg(degree) { return degree / 180 * Math.PI; } function main() { const canvas = document.querySelector('#c'); const renderer = new THREE.WebGLRenderer({ canvas }); renderer.shadowMap.enabled = true; const fov = 75; const aspect = 2; const near = 0.1; const far = 100; const camera = new THREE.PerspectiveCamera(fov, aspect, near, far); camera.position.y = 10; const scene = new THREE.Scene(); scene.background = new THREE.Color('#B4B4B4'); const controls = new THREE.OrbitControls(camera, canvas); controls.target.set(0, 0, 0); controls.update(); //add light const ambientLight = new THREE.AmbientLight(0xFFFFFF, 0.5); scene.add(ambientLight); function createShadowLight(shadowLightAngle, shadowLightRadius) { const shadowLight = new THREE.DirectionalLight(0xFFFFFF, 1); const shadowLightPositionX = Math.cos(deg(shadowLightAngle)) * shadowLightRadius; const shadowLightPositionZ = Math.sin(deg(shadowLightAngle)) * shadowLightRadius; shadowLight.position.set(shadowLightPositionX, 3, shadowLightPositionZ); shadowLight.target.position.set(0, 0, 0); shadowLight.castShadow = true; shadowLight.shadow.mapSize.width = 2000; shadowLight.shadow.mapSize.height = 2000; shadowLight.shadow.camera.left = -8; shadowLight.shadow.camera.right = 8; shadowLight.shadow.camera.far = 30; scene.add(shadowLight); scene.add(shadowLight.target); return shadowLight; } let shadowLightAngle = 30; let shadowLightRadius = 8; const shadowLight1 = createShadowLight(shadowL.........完整代码请登录后点击上方下载按钮下载查看
网友评论0