猜猜我用的是哪個大模型?我的世界游戲界面簡單的模擬效果

我的羅里吧嗦的,根據小朋友的要求,邊聽邊寫邊輸入的提示詞:

請生成一段完整的在網頁中用html5和javascript代碼模擬“我的世界”中游戲場景的互動畫面,要求提供若干人物選項可以選擇,請自行選擇需要使用哪些庫或框架來實現該功能,但希望能夠保存之后,用瀏覽器打開就能夠使用。希望能夠實現若干個人物的選擇,其中可供選擇的人物要具有動作演示的效果,請自己選一些實現動畫效果的JavaScript庫,可以直接在線使用,無須其它依賴和安裝,此功能可以支持兩個人同時操作。請提供完整的可以直接在瀏覽器中打開就能夠簡單實現的代碼

結果打開之后是這樣的,真能操控:

在這里插入圖片描述
代碼也是毫不吝嗇,一口氣輸出這么多:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Minecraft-Style 3D Game</title><link href="https://fastly.jsdelivr.net/npm/tailwindcss@2.2.19/dist/tailwind.min.css" rel="stylesheet"><link href="https://fastly.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.0.0/css/all.min.css" rel="stylesheet"><style>body {margin: 0;overflow: hidden;font-family: 'Minecraft', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;background-color: #333;}@font-face {font-family: 'Minecraft';src: url('https://fastly.jsdelivr.net/npm/minecraft-font@1.0.0/assets/fonts/minecraft.woff2') format('woff2');font-weight: normal;font-style: normal;}#game-container {position: relative;width: 100vw;height: 100vh;}#render-canvas {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}.interface {position: absolute;z-index: 10;color: white;text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);}.character-selection {top: 20px;left: 50%;transform: translateX(-50%);background-color: rgba(0, 0, 0, 0.6);border: 2px solid #555;padding: 15px;border-radius: 8px;width: 90%;max-width: 800px;}.controls {bottom: 20px;background-color: rgba(0, 0, 0, 0.6);border: 2px solid #555;padding: 10px;border-radius: 8px;width: 250px;}#player1-controls {left: 20px;}#player2-controls {right: 20px;}.status-bar {bottom: 20px;left: 50%;transform: translateX(-50%);background-color: rgba(0, 0, 0, 0.6);border: 2px solid #555;padding: 10px;border-radius: 8px;width: 90%;max-width: 500px;text-align: center;}.character-option {display: inline-block;margin: 5px;cursor: pointer;transition: all 0.3s;vertical-align: top;text-align: center;}.character-option img {width: 60px;height: 120px;object-fit: cover;border: 3px solid transparent;border-radius: 4px;filter: brightness(0.7);transition: all 0.3s;}.character-option:hover img {border-color: #aaa;filter: brightness(1);}.character-option.selected img {border-color: #5cf;filter: brightness(1);}.key {display: inline-block;background-color: rgba(255, 255, 255, 0.2);border: 1px solid rgba(255, 255, 255, 0.4);padding: 5px 8px;margin: 2px;border-radius: 4px;font-weight: bold;}.loading-screen {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: #333;display: flex;flex-direction: column;justify-content: center;align-items: center;z-index: 100;color: white;font-size: 24px;}.progress-bar {width: 300px;height: 20px;background-color: #222;border: 2px solid #555;margin-top: 20px;border-radius: 10px;overflow: hidden;}.progress {height: 100%;background-color: #5cf;width: 0%;transition: width 0.3s;}.dirt-block {display: inline-block;width: 30px;height: 30px;background-image: url('https://images.unsplash.com/photo-1607513746994-51f730a44832?q=80&w=30&auto=format&fit=crop');background-size: cover;margin: 0 5px;border-radius: 2px;vertical-align: middle;}@media (max-width: 768px) {.character-selection {padding: 10px;}.character-option img {width: 40px;height: 80px;}.controls {width: 150px;font-size: 12px;}.status-bar {font-size: 12px;}}</style>
</head>
<body><!-- Loading Screen --><div id="f2305d93-bcef-4e15-b7ce-a63c8d491b52" class="loading-screen"><div id="d40cd4d8-4c0e-48e4-a4d0-05bbfd6fa7db" class="dirt-block"></div><span id="916207e2-1aa4-49bc-b83c-c3eece7a44c2">Loading Minecraft-Style Game...</span><div id="b83699d9-78e5-4708-b801-716a85eef33f" class="progress-bar"><div id="39d52c16-9215-4ebf-a6a0-25c67b5a8de1" class="progress"></div></div></div><!-- Game Container --><div id="a24df7c4-8bb6-4ac3-9e3b-91aa2a63136f" class="game-container"><!-- Canvas for Three.js rendering --><canvas id="render-canvas"></canvas><!-- Character Selection UI --><div id="6c1abfc1-2331-40ab-a1e5-5eeb687d8092" class="interface character-selection"><div id="cf8ae90c-cf05-40b4-af8a-faf0b60c47cb" class="grid grid-cols-2 md:grid-cols-4 gap-2"><div id="b05e2f3c-5dbe-444f-9fa0-0e9a1e637919" class="text-center col-span-2 md:col-span-4 mb-2"><h2 id="c815cc5e-5ff2-46f5-9342-c4118cb0ecd7" class="text-xl font-bold">Select Characters</h2><div id="8268f04e-2325-4c9e-aa64-44bb6acb32c0" class="mt-1"><span id="1cff1ae5-0e54-4f3f-bf0b-ab87bce5408f" class="text-blue-300">Player 1:</span> <span id="player1-character">Steve</span> | <span id="5f21f725-c5c0-4034-bb01-a7f56da3f128" class="text-green-300">Player 2:</span> <span id="player2-character">Alex</span></div></div><div id="character-options"></div></div></div><!-- Player 1 Controls --><div id="player1-controls" class="interface controls"><h3 id="0376da1d-f2a0-4b95-907e-936476a841a1" class="text-blue-300 font-bold">Player 1 Controls:</h3><div id="d2bc2fb3-0502-4f5d-86b3-0f2a5f028a3a"><div id="a0294bc3-bcc8-4f28-b001-e9fc0ea2f56a" class="mb-1"><span id="cd96b41c-00d3-4309-b805-f2befdda40c9" class="key">W</span> Forward</div><div id="369be69d-d537-4bc3-a11e-2411ca8ee159" class="mb-1"><span id="9ae1c1c2-6f71-4575-8dd1-dc0fccd922e3" class="key">A</span><span id="d7053019-0309-433e-be51-603a9a10cb23" class="key">S</span><span id="1f78a456-bc7e-4bb2-9c52-7efc4c2c65c4" class="key">D</span> Move</div><div id="27312d5e-377e-4469-9802-7c3b846846f3" class="mb-1"><span id="0c01c5d2-b55a-4e2c-b21b-bdd32152b755" class="key">Space</span> Jump</div><div id="15cfdb30-6696-4cfd-b61c-6ac80e730ebe"><span id="6a42c7fc-dc00-442c-9478-8c5d295bd8b5" class="key">E</span> Action</div></div></div><!-- Player 2 Controls --><div id="player2-controls" class="interface controls"><h3 id="140c646d-11b9-4ea8-82ad-bf915bd8b8f0" class="text-green-300 font-bold">Player 2 Controls:</h3><div id="9dba0abc-4a53-4299-92b3-2c6319cfe33d"><div id="0c620c17-2910-430a-b0c5-428c2e86fbc8" class="mb-1"><span id="80c340f8-c8d9-41d0-9e71-0d14ea07e90e" class="key"></span> Forward</div><div id="007bccc6-d4fb-4658-98cf-6b5c88d491be" class="mb-1"><span id="086ae8b2-c512-4ad3-8a35-4d60e8a441ae" class="key"></span><span id="e4222974-a876-490d-aa4b-c2f4188ac164" class="key"></span><span id="0a94ad7f-9ef5-440e-a144-a875a790ffb0" class="key"></span> Move</div><div id="fb07362d-4363-40d3-b520-3b56722fbea1" class="mb-1"><span id="9a900166-a068-4c4c-b1a6-59bcc0304d38" class="key">Enter</span> Jump</div><div id="bac976e5-fa44-462a-902e-bf729516482e"><span id="d6c0bf9a-6007-4f5f-a530-a9b64c6f6c11" class="key">/</span> Action</div></div></div><!-- Status Bar --><div id="de6f85ed-466b-4bd7-9e51-5b778908622d" class="interface status-bar"><div id="game-status">Use WASD+Space and Arrow+Enter to move around and explore the world!</div></div></div><!-- Scripts --><script src="https://fastly.jsdelivr.net/npm/three@0.142.0/build/three.min.js"></script><script src="https://fastly.jsdelivr.net/npm/three@0.142.0/examples/js/controls/OrbitControls.js"></script><script src="https://fastly.jsdelivr.net/npm/@tweenjs/tween.js@18.6.4/dist/tween.umd.js"></script><script>// Main game classclass MinecraftStyleGame {constructor() {// Core propertiesthis.scene = null;this.camera = null;this.renderer = null;this.clock = new THREE.Clock();// Game statethis.players = [{ id: 1, character: 'Steve', model: null, position: new THREE.Vector3(0, 1, 0), velocity: new THREE.Vector3(), isJumping: false, onGround: true },{ id: 2, character: 'Alex', model: null, position: new THREE.Vector3(3, 1, 0), velocity: new THREE.Vector3(), isJumping: false, onGround: true }];this.keys = {player1: {forward: false,backward: false,left: false,right: false,jump: false,action: false},player2: {forward: false,backward: false,left: false,right: false,jump: false,action: false}};// Game world parametersthis.worldSize = 20;this.blockSize = 1;this.gravity = 0.02;this.jumpForce = 0.2;this.moveSpeed = 0.1;// Character optionsthis.characterOptions = [{ name: 'Steve', texture: 'https://minecraft-heads.com/media/com_minecraft/skins/original/steve.png', playerID: 1 },{ name: 'Alex', texture: 'https://minecraft-heads.com/media/com_minecraft/skins/original/alex.png', playerID: 2 },{ name: 'Zombie', texture: 'https://minecraft-heads.com/media/com_minecraft/skins/original/zombie.png', playerID: null },{ name: 'Skeleton', texture: 'https://minecraft-heads.com/media/com_minecraft/skins/original/skeleton.png', playerID: null },{ name: 'Creeper', texture: 'https://minecraft-heads.com/media/com_minecraft/skins/original/creeper.png', playerID: null },{ name: 'Enderman', texture: 'https://minecraft-heads.com/media/com_minecraft/skins/original/enderman.png', playerID: null },{ name: 'Villager', texture: 'https://minecraft-heads.com/media/com_minecraft/skins/original/villager.png', playerID: null },{ name: 'Pig', texture: 'https://minecraft-heads.com/media/com_minecraft/skins/original/pig.png', playerID: null }];// Resources to loadthis.textures = {dirt: new THREE.TextureLoader().load('https://images.unsplash.com/photo-1607513746994-51f730a44832?q=80&w=200&auto=format&fit=crop'),grass: new THREE.TextureLoader().load('https://images.unsplash.com/photo-1626269555171-153a1bca85f7?q=80&w=200&auto=format&fit=crop'),stone: new THREE.TextureLoader().load('https://images.unsplash.com/photo-1588371758051-e93a5ce1b5f4?q=80&w=200&auto=format&fit=crop'),wood: new THREE.TextureLoader().load('https://images.unsplash.com/photo-1599751449128-eb7249c3d6b1?q=80&w=200&auto=format&fit=crop'),leaves: new THREE.TextureLoader().load('https://images.unsplash.com/photo-1570822153940-2b3b795f54cf?q=80&w=200&auto=format&fit=crop')};// Loading progressthis.resourcesLoaded = 0;this.totalResources = Object.keys(this.textures).length + this.characterOptions.length;// Initialize the gamethis.init();}init() {// Initialize Three.js scenethis.initScene();// Handle loadingthis.loadResources();// UI setupthis.setupCharacterSelection();// Setup event listenersthis.setupEventListeners();// Start animation loopthis.animate();}initScene() {// Create scenethis.scene = new THREE.Scene();this.scene.background = new THREE.Color(0x87CEEB); // Sky blue// Create camerathis.camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);this.camera.position.set(10, 10, 10);this.camera.lookAt(0, 0, 0);// Create rendererthis.renderer = new THREE.WebGLRenderer({ canvas: document.getElementById('render-canvas'),antialias: true });this.renderer.setSize(window.innerWidth, window.innerHeight);this.renderer.shadowMap.enabled = true;// Add lightconst ambientLight = new THREE.AmbientLight(0xffffff, 0.6);this.scene.add(ambientLight);const directionalLight = new THREE.DirectionalLight(0xffffff, 0.8);directionalLight.position.set(10, 20, 10);directionalLight.castShadow = true;directionalLight.shadow.mapSize.width = 2048;directionalLight.shadow.mapSize.height = 2048;this.scene.add(directionalLight);// Add controls for debugging// this.controls = new THREE.OrbitControls(this.camera, this.renderer.domElement);}loadResources() {// Track texture loadingconst loadingManager = new THREE.LoadingManager();loadingManager.onProgress = (url, itemsLoaded, itemsTotal) => {this.resourcesLoaded++;this.updateLoadingProgress();};loadingManager.onLoad = () => {// All textures are loadedthis.createWorld();setTimeout(() => {document.getElementById('f2305d93-bcef-4e15-b7ce-a63c8d491b52').style.display = 'none';}, 500);};// Create texture loader with the loading managerconst textureLoader = new THREE.TextureLoader(loadingManager);// Load all texturesObject.keys(this.textures).forEach(key => {const url = this.textures[key].source?.data?.src;if (url) {this.textures[key] = textureLoader.load(url);this.textures[key].wrapS = THREE.RepeatWrapping;this.textures[key].wrapT = THREE.RepeatWrapping;}});// Load character texturesthis.characterOptions.forEach(char => {textureLoader.load(char.texture, () => {this.resourcesLoaded++;this.updateLoadingProgress();});});}updateLoadingProgress() {const progress = Math.min((this.resourcesLoaded / this.totalResources) * 100, 100);document.getElementById('39d52c16-9215-4ebf-a6a0-25c67b5a8de1').style.width = `${progress}%`;}createWorld() {// Create groundthis.createTerrain();// Create various structuresthis.createStructures();// Create player charactersthis.createPlayerCharacters();}createTerrain() {// Create base terrainconst groundGeometry = new THREE.BoxGeometry(this.worldSize, 1, this.worldSize);const groundMaterial = new THREE.MeshStandardMaterial({ map: this.textures.grass });const ground = new THREE.Mesh(groundGeometry, groundMaterial);ground.position.y = -0.5;ground.receiveShadow = true;this.scene.add(ground);// Create random terrain variationsfor (let x = -this.worldSize/2; x < this.worldSize/2; x += this.blockSize) {for (let z = -this.worldSize/2; z < this.worldSize/2; z += this.blockSize) {// Skip the center area for player spawnif (Math.abs(x) < 4 && Math.abs(z) < 4) continue;if (Math.random() < 0.1) {const height = Math.floor(Math.random() * 3) + 1;for (let y = 0; y < height; y++) {const material = y === height - 1 ? new THREE.MeshStandardMaterial({ map: this.textures.grass }) : new THREE.MeshStandardMaterial({ map: this.textures.dirt });this.createBlock(x, y, z, material);}}// Create treesif (Math.random() < 0.02) {this.createTree(x, 0, z);}}}}createBlock(x, y, z, material) {const geometry = new THREE.BoxGeometry(this.blockSize, this.blockSize, this.blockSize);const block = new THREE.Mesh(geometry, material);block.position.set(x, y, z);block.castShadow = true;block.receiveShadow = true;this.scene.add(block);return block;}createTree(x, y, z) {// Tree trunkconst trunkHeight = 4 + Math.floor(Math.random() * 3);const woodMaterial = new THREE.MeshStandardMaterial({ map: this.textures.wood });for (let i = 0; i < trunkHeight; i++) {this.createBlock(x, y + i, z, woodMaterial);}// Tree leavesconst leavesMaterial = new THREE.MeshStandardMaterial({ map: this.textures.leaves,transparent: true,alphaTest: 0.8});const leavesSize = 3;for (let lx = -leavesSize; lx <= leavesSize; lx++) {for (let ly = 0; ly <= leavesSize + 1; ly++) {for (let lz = -leavesSize; lz <= leavesSize; lz++) {// Create spherical-ish shape for leavesif (lx*lx + (ly-1)*(ly-1) + lz*lz <= leavesSize*leavesSize) {// Don't place leaves where trunk isif (!(lx === 0 && lz === 0 && ly < leavesSize)) {this.createBlock(x + lx, y + trunkHeight - 1 + ly, z + lz, leavesMaterial);}}}}}}createStructures() {// Create a small houseconst housePosX = 8;const housePosZ = 8;const houseSizeX = 5;const houseSizeZ = 4;const wallHeight = 3;const stoneMaterial = new THREE.MeshStandardMaterial({ map: this.textures.stone });const woodMaterial = new THREE.MeshStandardMaterial({ map: this.textures.wood });// Floorfor (let x = 0; x < houseSizeX; x++) {for (let z = 0; z < houseSizeZ; z++) {this.createBlock(housePosX + x, 0, housePosZ + z, stoneMaterial);}}// Wallsfor (let x = 0; x < houseSizeX; x++) {for (let y = 1; y <= wallHeight; y++) {// Front and back wallsif (!(x === 2 && y < 3)) { // Door in front wallthis.createBlock(housePosX + x, y, housePosZ, woodMaterial); // Front wall}this.createBlock(housePosX + x, y, housePosZ + houseSizeZ - 1, woodMaterial); // Back wall}}for (let z = 0; z < houseSizeZ; z++) {for (let y = 1; y <= wallHeight; y++) {// Side wallsthis.createBlock(housePosX, y, housePosZ + z, woodMaterial); // Left wallthis.createBlock(housePosX + houseSizeX - 1, y, housePosZ + z, woodMaterial); // Right wall}}// Rooffor (let x = -1; x <= houseSizeX; x++) {for (let z = -1; z <= houseSizeZ; z++) {this.createBlock(housePosX + x, wallHeight + 1, housePosZ + z, stoneMaterial);}}// Create a small mining areaconst minePosX = -8;const minePosZ = -8;// Create pitfor (let x = 0; x < 4; x++) {for (let z = 0; z < 4; z++) {// Remove blocks to create a pit// but leave some stone blocks at the bottomif (!(x === 1 && z === 1) && !(x === 2 && z === 2)) {this.createBlock(minePosX + x, -3, minePosZ + z, stoneMaterial);}}}// Add some stone around the pitfor (let i = 0; i < 10; i++) {const rx = minePosX + Math.floor(Math.random() * 6) - 1;const rz = minePosZ + Math.floor(Math.random() * 6) - 1;const ry = Math.floor(Math.random() * 2);this.createBlock(rx, ry, rz, stoneMaterial);}}createPlayerCharacters() {// We'll create simple block player models for now// In a real implementation, you would load Minecraft character models// Player 1this.createPlayerModel(this.players[0]);// Player 2this.createPlayerModel(this.players[1]);}createPlayerModel(player) {// Get character info from optionsconst characterInfo = this.characterOptions.find(c => c.name === player.character);if (!characterInfo) return;// Create character groupconst playerModel = new THREE.Group();// Load character textureconst textureLoader = new THREE.TextureLoader();const texture = textureLoader.load(characterInfo.texture);// Create body parts with correct proportions// Headconst headGeometry = new THREE.BoxGeometry(0.8, 0.8, 0.8);const headMaterial = new THREE.MeshStandardMaterial({ map: texture });const head = new THREE.Mesh(headGeometry, headMaterial);head.position.y = 1.4;head.castShadow = true;playerModel.add(head);// Bodyconst bodyGeometry = new THREE.BoxGeometry(0.6, 1.2, 0.4);const bodyMaterial = new THREE.MeshStandardMaterial({ map: texture,color: player.id === 1 ? 0x3090ff : 0x60d060 });const body = new THREE.Mesh(bodyGeometry, bodyMaterial);body.position.y = 0.6;body.castShadow = true;playerModel.add(body);// Armsconst armGeometry = new THREE.BoxGeometry(0.3, 1.0, 0.3);const armMaterial = new THREE.MeshStandardMaterial({ map: texture,color: player.id === 1 ? 0x2080dd : 0x50c050});const leftArm = new THREE.Mesh(armGeometry, armMaterial);leftArm.position.set(-0.45, 0.5, 0);leftArm.castShadow = true;playerModel.add(leftArm);const rightArm = new THREE.Mesh(armGeometry, armMaterial);rightArm.position.set(0.45, 0.5, 0);rightArm.castShadow = true;playerModel.add(rightArm);// Legsconst legGeometry = new THREE.BoxGeometry(0.3, 1.0, 0.3);const legMaterial = new THREE.MeshStandardMaterial({ map: texture,color: 0x3060b0});const leftLeg = new THREE.Mesh(legGeometry, legMaterial);leftLeg.position.set(-0.2, -0.5, 0);leftLeg.castShadow = true;playerModel.add(leftLeg);const rightLeg = new THREE.Mesh(legGeometry, legMaterial);rightLeg.position.set(0.2, -0.5, 0);rightLeg.castShadow = true;playerModel.add(rightLeg);// Position the player modelplayerModel.position.copy(player.position);// Store limbs for animationplayerModel.userData = {head,leftArm,rightArm,leftLeg,rightLeg,animationTime: 0};// Add to scene and assign to playerthis.scene.add(playerModel);player.model = playerModel;}setupCharacterSelection() {const container = document.getElementById('character-options');this.characterOptions.forEach((char, index) => {const option = document.createElement('div');option.className = 'character-option';if (char.playerID === 1) option.classList.add('selected');const img = document.createElement('img');img.src = char.texture;img.alt = char.name;const name = document.createElement('div');name.textContent = char.name;option.appendChild(img);option.appendChild(name);option.addEventListener('click', () => {// Show character selection dialogthis.selectCharacter(char, index);});container.appendChild(option);});}selectCharacter(character, index) {// Create a simple modal for character selectionconst selection = prompt(`Assign ${character.name} to:\n1: Player 1\n2: Player 2\n0: Cancel`);if (selection === '1' || selection === '2') {const playerIndex = parseInt(selection) - 1;const player = this.players[playerIndex];// Update selectedPlayerID on old characterconst oldCharOption = this.characterOptions.find(c => c.name === player.character);if (oldCharOption) oldCharOption.playerID = null;// Update player characterplayer.character = character.name;character.playerID = parseInt(selection);// Update UIdocument.getElementById(`player${selection}-character`).textContent = character.name;// Remove old player model and create a new oneif (player.model) {this.scene.remove(player.model);}this.createPlayerModel(player);// Update character selection UIconst options = document.querySelectorAll('.character-option');options.forEach((opt, idx) => {if (this.characterOptions[idx].playerID === 1 || this.characterOptions[idx].playerID === 2) {opt.classList.add('selected');} else {opt.classList.remove('selected');}});}}setupEventListeners() {// Keyboard controlsdocument.addEventListener('keydown', (event) => this.handleKeyDown(event));document.addEventListener('keyup', (event) => this.handleKeyUp(event));// Window resizewindow.addEventListener('resize', () => this.handleResize());}handleKeyDown(event) {// Player 1 controls (WASD + Space)switch(event.code) {case 'KeyW': this.keys.player1.forward = true; break;case 'KeyS': this.keys.player1.backward = true; break;case 'KeyA': this.keys.player1.left = true; break;case 'KeyD': this.keys.player1.right = true; break;case 'Space': event.preventDefault();this.keys.player1.jump = true; break;case 'KeyE': this.keys.player1.action = true; break;}// Player 2 controls (Arrow keys + Enter)switch(event.code) {case 'ArrowUp': this.keys.player2.forward = true; break;case 'ArrowDown': this.keys.player2.backward = true; break;case 'ArrowLeft': this.keys.player2.left = true; break;case 'ArrowRight': this.keys.player2.right = true; break;case 'Enter': this.keys.player2.jump = true; break;case 'Slash': this.keys.player2.action = true; break;}}handleKeyUp(event) {// Player 1 controlsswitch(event.code) {case 'KeyW': this.keys.player1.forward = false; break;case 'KeyS': this.keys.player1.backward = false; break;case 'KeyA': this.keys.player1.left = false; break;case 'KeyD': this.keys.player1.right = false; break;case 'Space': this.keys.player1.jump = false; break;case 'KeyE': this.keys.player1.action = false; break;}// Player 2 controlsswitch(event.code) {case 'ArrowUp': this.keys.player2.forward = false; break;case 'ArrowDown': this.keys.player2.backward = false; break;case 'ArrowLeft': this.keys.player2.left = false; break;case 'ArrowRight': this.keys.player2.right = false; break;case 'Enter': this.keys.player2.jump = false; break;case 'Slash': this.keys.player2.action = false; break;}}handleResize() {const width = window.innerWidth;const height = window.innerHeight;this.camera.aspect = width / height;this.camera.updateProjectionMatrix();this.renderer.setSize(width, height);}updatePlayer(player, controls, deltaTime) {if (!player.model) return;// Movement directionconst moveDir = new THREE.Vector3(0, 0, 0);if (controls.forward) moveDir.z -= 1;if (controls.backward) moveDir.z += 1;if (controls.left) moveDir.x -= 1;if (controls.right) moveDir.x += 1;// Normalize movement directionif (moveDir.length() > 0) {moveDir.normalize();// Calculate movementconst movement = moveDir.multiplyScalar(this.moveSpeed * deltaTime * 60);// Update positionplayer.position.x += movement.x;player.position.z += movement.z;// Update animation stateplayer.model.userData.animationTime += deltaTime * 10;// Animate legs and arms while walkingthis.animateWalking(player.model, player.model.userData.animationTime);// Face direction of movementif (movement.x !== 0 || movement.z !== 0) {player.model.rotation.y = Math.atan2(movement.x, movement.z);}} else {// Reset animation when not movingthis.resetAnimation(player.model);}// Jumpingif (controls.jump && player.onGround) {player.velocity.y = this.jumpForce;player.isJumping = true;player.onGround = false;// Update game statusdocument.getElementById('game-status').textContent = `Player ${player.id} jumped!`;}// Apply gravityplayer.velocity.y -= this.gravity;player.position.y += player.velocity.y;// Ground collision detectionif (player.position.y <= 1) {player.position.y = 1;player.velocity.y = 0;player.onGround = true;player.isJumping = false;}// World boundariesconst boundaryLimit = this.worldSize / 2 - 1;player.position.x = Math.max(-boundaryLimit, Math.min(boundaryLimit, player.position.x));player.position.z = Math.max(-boundaryLimit, Math.min(boundaryLimit, player.position.z));// Update model positionplayer.model.position.copy(player.position);// Perform action if requestedif (controls.action) {this.performAction(player);}}performAction(player) {// Simple action feedbackdocument.getElementById('game-status').textContent = `Player ${player.id} is performing an action!`;// Animate action (e.g. arm swing)if (player.model) {const rightArm = player.model.userData.rightArm;// Create a simple animation for the arm swingconst startRotation = { x: 0 };const endRotation = { x: -Math.PI / 2 };// Animate swing downconst swingDown = new TWEEN.Tween(startRotation).to(endRotation, 200).easing(TWEEN.Easing.Quadratic.Out).onUpdate(() => {rightArm.rotation.x = startRotation.x;});// Animate swing backconst swingBack = new TWEEN.Tween(endRotation).to({ x: 0 }, 200).easing(TWEEN.Easing.Quadratic.In).onUpdate(() => {rightArm.rotation.x = endRotation.x;});// Chain the animationsswingDown.chain(swingBack);swingDown.start();}}animateWalking(model, time) {if (!model || !model.userData) return;const { leftLeg, rightLeg, leftArm, rightArm } = model.userData;// Animate legsif (leftLeg && rightLeg) {leftLeg.rotation.x = Math.sin(time) * 0.5;rightLeg.rotation.x = Math.sin(time + Math.PI) * 0.5;}// Animate armsif (leftArm && rightArm) {leftArm.rotation.x = Math.sin(time + Math.PI) * 0.5;rightArm.rotation.x = Math.sin(time) * 0.5;}}resetAnimation(model) {if (!model || !model.userData) return;const { leftLeg, rightLeg, leftArm, rightArm } = model.userData;// Reset all rotationsif (leftLeg) leftLeg.rotation.set(0, 0, 0);if (rightLeg) rightLeg.rotation.set(0, 0, 0);if (leftArm) leftArm.rotation.set(0, 0, 0);if (rightArm) rightArm.rotation.set(0, 0, 0);}updateCamera() {// Calculate center position between playersconst center = new THREE.Vector3();this.players.forEach(player => {center.add(player.position);});center.divideScalar(this.players.length);// Calculate distance between playerslet maxDistance = 0;this.players.forEach(player => {const distance = player.position.distanceTo(center);maxDistance = Math.max(maxDistance, distance);});// Adjust camera position based on player positionsconst cameraDistance = Math.max(10, maxDistance * 3);const cameraHeight = Math.max(6, maxDistance * 1.5);// Smoothly move camera to new positionconst targetCameraPos = new THREE.Vector3(center.x + cameraDistance * Math.sin(Date.now() * 0.0001),cameraHeight,center.z + cameraDistance * Math.cos(Date.now() * 0.0001));this.camera.position.lerp(targetCameraPos, 0.02);this.camera.lookAt(center);}animate() {requestAnimationFrame(() => this.animate());const deltaTime = this.clock.getDelta();// Update playersthis.updatePlayer(this.players[0], this.keys.player1, deltaTime);this.updatePlayer(this.players[1], this.keys.player2, deltaTime);// Update camera to follow playersthis.updateCamera();// Update animationsTWEEN.update();// Render scenethis.renderer.render(this.scene, this.camera);}}// Initialize the game when page is loadedwindow.addEventListener('load', () => {const game = new MinecraftStyleGame();});</script>
</body>
</html>

在這里插入圖片描述

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/899501.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/899501.shtml
英文地址,請注明出處:http://en.pswp.cn/news/899501.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

AI知識補全(八):多模態大模型是什么?

名人說&#xff1a;人生如逆旅&#xff0c;我亦是行人。 ——蘇軾《臨江仙送錢穆父》 創作者&#xff1a;Code_流蘇(CSDN)&#xff08;一個喜歡古詩詞和編程的Coder&#x1f60a;&#xff09; 上一篇&#xff1a;AI知識補全&#xff08;七&#xff09;&#xff1a;AI Agent 智能…

更新docker 容器時,提前換后端jar 包,為什么會存在異常

我們現場更新時&#xff0c;通常都是提前將后端jar 包替換了&#xff0c;然后到了更新的時間&#xff0c;只需要更新相關的前端文件和修改各種配置&#xff0c;就行了。 但是最近一次更新操作中&#xff0c;忽然發現&#xff0c;提前更新后端包&#xff0c;會存在依賴丟失問題…

LoRA 模型微調框架核心原理及實現步驟

LoRA&#xff08;Low-Rank Adaptation&#xff09;模型微調框架通過低秩矩陣分解原理&#xff0c;實現了對大型預訓練模型的高效微調。其核心原理是&#xff1a;在凍結預訓練模型權重的基礎上&#xff0c;向特定層注入可訓練的低秩矩陣&#xff0c;以極少量參數&#xff08;通常…

XHR.readyState詳解

XHR.readyState詳解 引言 XHR.readyState是XMLHttpRequest對象的一個屬性,它反映了當前請求的狀態。在Ajax編程中,正確理解和使用XHR.readyState對于調試和確保異步請求的正確執行至關重要。本文將詳細介紹XHR.readyState的屬性值、含義以及在Ajax請求中的具體應用。 XHR.…

MySQL8.4 InnoDB Cluster高可用集群使用指南

簡介 高可用方案 Orchestrator&#xff1a; 可視化 Web 界面管理 MySQL 拓撲結構&#xff0c;并且兼容多種復制架構&#xff08;異步、半同步、GTID&#xff09;&#xff0c;提供自動和手動的故障轉移。但是8.0.21后 MySQL 更新了主從復制相關命令&#xff0c;Orchestrator無…

擴散模型總結

目錄 定義與原理 發展歷程 正向擴散過程 反向擴散過程 噪聲預測網絡 離散時間模型 連續時間模型 條件擴散模型 生成質量 訓練穩定性 采樣靈活性 圖像生成 音頻合成 文本生成 計算效率 模型復雜度 定義與原理 擴散模型是一種新型的生成模型,其核心原理源于熱力…

【Java】Java核心知識點與相應面試技巧(七)——類與對象(二)

Java 類與對象篇 1.上期面試題解析&#xff1a; 上文鏈接&#xff1a;https://blog.csdn.net/weixin_73492487/article/details/146607026 創建對象時的內存分配過程&#xff1f; ① 加載類 ② 堆內存分配空間 ③ 默認初始化 ④ 顯式初始化 ⑤ 構造器執行 this和super能否同時…

筆記:遇見未來——6G協同創新技術研討會

https://www.cww.net.cn/article?id564308 研討會由中國移動研究院首席科學家易芝玲博士主持。來自清華大學-中國移動聯合研究院、北京郵電大學-中國移動研究院聯合創新中心、東南大學-中國移動研究院聯合創新中心、中關村泛聯移動通信技術創新應用研究院等合作載體的知名教授…

Python Cookbook-4.14 反轉字典

任務 給定一個字典&#xff0c;此字典將不同的鍵映射到不同的值。而你想創建一個反轉的字典&#xff0c;將各個值反映射到鍵。 解決方案 可以創建一個函數&#xff0c;此函數傳遞一個列表推導作為dict的參數以創建需要的字典。 def invert_dict(d):return dict([(v,k) for …

深度學習在測距模型中的應用

一、單目視覺測距和雙目視覺測距簡介 1、單目視覺測距 模型&#xff1a;深度估計&#xff08;Depth Estimation&#xff09; 原理&#xff1a;通過深度學習模型&#xff08;如MonoDepth2、MiDaS&#xff09;或傳統的計算機視覺方法&#xff08;如單目相機結合物體大小推斷&am…

Linux Mem -- Slub內存分配器的幾點疑問及解答

目錄 1 怎樣通過object地址獲取其對應的struct slab&#xff1f; 2 struct page、struct folio和struct slab類型之間轉換&#xff0c;怎么保證內部關鍵數據的傳遞&#xff1f; 3 怎樣判斷一個內存空間是屬于slab、page管理&#xff1f; 4 struct page 結構中 __mapcou…

pip install cryptacular卡住,卡在downloading階段

筆者安裝pip install cryptacular卡在downloading階段&#xff0c;但不知道為何 Collecting cryptacularCreated temporary directory: /tmp/pip-unpack-qfbl8f08http://10.170.22.41:8082 "GET http://repo.huaweicloud.com/repository/pypi/packages/42/69/34d478310d6…

Lag-Llama時間序列模型簡單實現數據預測

前言&#xff1a; 最近在大模型預測&#xff0c;簡單了解了lag-llama開源項目&#xff0c;網上也有很多講解原理的&#xff0c;這里就將如何快速上手使用說一下&#xff0c;只懂得一點點皮毛&#xff0c;有錯誤的地方歡迎大佬指出。 簡單介紹&#xff1a; Lag-Llama 是一個開…

Plastiform復制膠泥:高精度表面復制與測量的高效工具

在工業制造和質量檢測領域&#xff0c;表面復制和測量是確保產品質量的關鍵環節。Plastiform復制膠泥作為一種創新材料&#xff0c;憑借其出色的性能和多樣化的應用&#xff0c;為用戶提供了可靠的解決方案。它能夠快速捕捉復雜表面的細節&#xff0c;確保測量結果的準確性&…

AI大模型、機器學習以及AI Agent開源社區和博客

以下梳理了適合學習 AI大模型、機器學習、AI Agent和多模態技術 的英文網站、社區、官網和博客&#xff0c;按類別分類整理&#xff1a; 一、官方網站與開源平臺 1. AI大模型 (Large Language Models) ? OpenAI ? 官網: openai.com ? 內容: GPT系列模型文檔、研究論文、AP…

python 上下文管理器with

with 上下文管理器 上下文管理器示例如下&#xff1a;若想不使用with關鍵字 上下文管理器 任何實現了 enter() 和 exit() 方法的對象都可稱之為上下文管理器&#xff0c;上下文管理器對象可以使用 with 關鍵字。 必須同時具有__enter__和__exit__&#xff0c;就可以使用with語句…

買賣股票的最佳時機(121)

121. 買賣股票的最佳時機 - 力扣&#xff08;LeetCode&#xff09; 解法&#xff1a; class Solution { public:int maxProfit(vector<int>& prices) {int cur_min prices[0];int max_profit 0;for (int i 1; i < prices.size(); i) {if (prices[i] > cur…

CesiumJS 本地數據瓦片加載南北兩極出現圓點問題

const imageryProvider new UrlTemplateImageryProvider({url: "/gisimg/{z}/{x}/{reverseY}.png",minimumLevel: 0,maximumLevel: 19})上面這段代碼是加載本地切片&#xff0c;但是有個致命問題就是會出現南北兩極顯示藍色圓點 解決方案&#xff1a; 加上這句話&am…

Linux編譯器gcc/g++使用完全指南:從編譯原理到動靜態鏈接

一、gcc/g基礎認知 在Linux開發環境中&#xff0c;gcc和g是我們最常用的編譯器工具&#xff1a; gcc&#xff1a;GNU C Compiler&#xff0c;專門用于編譯C語言程序g&#xff1a;GNU C Compiler&#xff0c;用于編譯C程序&#xff08;也可編譯C語言&#xff09; &#x1f4cc…

Vue學習筆記集--computed

computed 在 Vue 3 的 Composition API 中&#xff0c;computed 用于定義響應式計算屬性 它的核心特性是自動追蹤依賴、緩存計算結果&#xff08;依賴未變化時不會重新計算&#xff09; 基本用法 1. 定義只讀計算屬性 import { ref, computed } from vue;const count ref(…