three实现三维箭头火箭发射转圈喷气动画效果代码
代码语言:html
所属分类:动画
代码描述:three实现三维箭头火箭发射转圈喷气动画效果代码
代码标签: three 三维 箭头 火箭 发射 转圈 喷气 动画
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> body { margin: 0; padding: 0; } </style> </head> <body> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/three.144.js"></script> <script > let renderer, camera, scene; let playerObject; let exhaustGroup; let exhaustGeometry; let exhaustMaterial; function init() { exhaustGeometry = new THREE.DodecahedronGeometry(2); exhaustMaterial = new THREE.MeshStandardMaterial({ color: 0x996666, opacity: 0.3 }); scene = new THREE.Scene(); camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 ); renderer = new THREE.WebGLRenderer({ antialias: true }); renderer.setSize(window.innerWidth, window.innerHeight); document.body.appendChild(renderer.domElement); camera.position.z = 20; camera.position.y = 70; var point = new THREE.Vector3(0, 60, 0); camera.lookAt(point); const playerGeometry = new THREE.ConeGeometry(10, 40, 6); const playerMaterial = new THREE.MeshStandardMaterial({ color: 0xffffff }); playerObject = new THREE.Mesh(playerGeometry, playerMaterial); playerObject.rotation.z = -1.57; scene.add(playerObject); exhaustGroup = new THREE.Group(); scene.add(exhaustGroup); const ambientLight = new THREE.AmbientLight(0x999999, 1); // soft white light scene.add(ambientLight); light = new THREE.PointLight(0x999999, 2, 0); light.position.set(30, 300, 300); scene.add(light); } var keys = []; keys[38] = true; keys[39] = true; //var focalLength = 300; var fov = 500; //var fov = 10000; var camera_y = 115; var gravity = 0.05; var player = { x: 0, y: 30, z: -200, vel: 0, yVel: 0, maxVel: 6, slowdown: 0.1, speedup: 2, brake: 2, bearing: 0, pitch: 0, terminal_velocity: 3, steering: { speedup: 1, max: 5, vel: 0, slowdown: 0.5 }, pitching: { speedup: 1, max: 5, vel: 0, slowdown: 0.5 }, exhaust_velocity: 8, exhaust_max_age: 30, EXHAUST_OUTPUT: 40, exhaust_idle_output: 1, exhaust_idle_velocity: 3, exhaust_particles: [], exhaust: function (thrust) { //console.log("exhausting."); var exhaust_radians = (((player.bearing + 160 + Math.floor(Math.random() * 40)) % 360) * Math.PI) / 180; if (thrust == true && exhaustGroup.children.length < 1000) { let exhaustObject = new THREE.Mesh( exhaustGeometry, exhaustMaterial ); exhaustObject.life = 20 + (Math.random() * 2 - 1) * 20; exhaustObject.remaining_life = exhaustObject.life; exhaustObject.position.x = player.x - Math.cos((player.bearing * Math.PI) / 180) * 20; exhaustObject.position.y = player.y; exhaustObject.position.z = player.z - Math.sin((player.bearing * Math.PI) / 180) * 20; exhaustObject.rotation.x = (Math.random() * 2 - 1) * 90; exhaustObject.rotation.y = (Math.random() * 2 - 1) * 90; exhaustObject.rotation.z = (Math.random() * 2 - 1) * 90; exhaustObject.velocity_x = (Math.random() * 2 - 1) * 0.5; exhaustObject.velocity_y = (Math.random() * 2 - 1) * 0.5; exhaustObject.velocity_z = (Math.random() * 2 - 1) * 0.5; exhaustGroup.add(exhaustObject); } } }; var pixels = []; pixels.push({ x: 0, y: 0, z: 0 }); //for (var x = -350; x < 350; x+=20) { // for (var z = -350; z < 150; z+=20) { // pixels.push({x: x, y: 0, z: z}); // } function update() { if (keys[39]) { // right arrow if (player.steering.vel > -player.steering.max && player.vel > 0) { //player.steering.vel -= player.vel%player.maxVel; .........完整代码请登录后点击上方下载按钮下载查看
网友评论0