From ae329daf2ea96ef6e2fddb2104fe129fc309e9f1 Mon Sep 17 00:00:00 2001 From: nicomacbookpro <805879871@qq.com> Date: Mon, 25 Aug 2025 09:34:43 +0800 Subject: [PATCH] ocean --- src/utils/plane_ocean2.js | 32 ++++++++++++++++++++++++++++++ src/views/bigScreen/home/index.vue | 8 ++++++-- 2 files changed, 38 insertions(+), 2 deletions(-) create mode 100644 src/utils/plane_ocean2.js diff --git a/src/utils/plane_ocean2.js b/src/utils/plane_ocean2.js new file mode 100644 index 0000000..b9f7a7e --- /dev/null +++ b/src/utils/plane_ocean2.js @@ -0,0 +1,32 @@ +import * as THREE from 'three'; +import { Water } from 'three/examples/jsm/objects/Water.js'; + +const waterGeometry = new THREE.PlaneGeometry(50, 50); + +const ocean = new Water( + waterGeometry, + { + textureWidth: 512, + textureHeight: 512, + waterNormals: new THREE.TextureLoader().load(`https://z2586300277.github.io/3d-file-server/images/texture/waternormals.jpg`, function (texture) { + texture.wrapS = texture.wrapT = THREE.RepeatWrapping; + }), + sunDirection: new THREE.Vector3(0, 1, 0), // 设置太阳方向为垂直向下 + sunColor: 0xffffff, + waterColor: 'rgb(15,187,194)', + distortionScale: 3.7, + fog: false, // 关闭雾效果 + alpha: 1.0, // 设置透明度 + } +); + +ocean.rotation.x = -Math.PI / 2; + +function animate() { + ocean.material.uniforms['time'].value += 1.0 / 60.0; + requestAnimationFrame(animate); +} + +animate(); + +export { ocean }; diff --git a/src/views/bigScreen/home/index.vue b/src/views/bigScreen/home/index.vue index ec161df..ea09db5 100644 --- a/src/views/bigScreen/home/index.vue +++ b/src/views/bigScreen/home/index.vue @@ -69,7 +69,10 @@ import { drawAxes } from "@/utils/three.js"; import { connectWebsocket, closeWebsocket } from "@/utils/websocket.js"; import { planeGrass } from "@/utils/plane_grass.js"; import { planeDesert } from "@/utils/plane_desert.js"; -import { ocean } from "@/utils/plane_ocean.js"; +// import { ocean } from "@/utils/plane_ocean.js"; + +import { ocean, textureCube } from "@/utils/plane_ocean2.js"; + export default { name: 'Home', props: { @@ -281,7 +284,8 @@ export default { planeDesert.visible = false planeDesert.position.set(25, 1, 25) this.demo1.scene.add(planeDesert) - ocean.position.set(25, 1, 25) + console.log(ocean); + ocean.position.set(25, 2, 25) this.demo1.scene.add(ocean) }, beforeDestroy() {