From f3d8c04c26e9252330c4bbfdba55fef14a889835 Mon Sep 17 00:00:00 2001 From: "H. E." <6037756+rndexe@users.noreply.github.com> Date: Fri, 9 Aug 2024 22:20:17 +0530 Subject: [PATCH] Fix grass shader demo build errors (#62) * Fix Grass shader demo * Update build script name --- demos/grass-shader/package.json | 2 +- demos/grass-shader/src/Grass.jsx | 15 +++++++-------- demos/grass-shader/src/GrassMaterial.js | 2 +- 3 files changed, 9 insertions(+), 10 deletions(-) diff --git a/demos/grass-shader/package.json b/demos/grass-shader/package.json index 32c0ad33..4fba3771 100644 --- a/demos/grass-shader/package.json +++ b/demos/grass-shader/package.json @@ -29,7 +29,7 @@ "dev": "vite --host", "dev3": "e2e-dev $npm_package_name", "build": "tsc && vite build", - "bbuild2": "tsc && e2e-build $npm_package_name", + "build2": "tsc && e2e-build $npm_package_name", "preview": "vite preview" }, "browserslist": [ diff --git a/demos/grass-shader/src/Grass.jsx b/demos/grass-shader/src/Grass.jsx index 7a948b49..7a07aa42 100755 --- a/demos/grass-shader/src/Grass.jsx +++ b/demos/grass-shader/src/Grass.jsx @@ -3,7 +3,6 @@ import * as THREE from "three" import React, { useRef, useMemo } from "react" import SimplexNoise from "simplex-noise" import { useFrame, useLoader } from "@react-three/fiber" -import { Geometry } from "three/examples/jsm/deprecated/Geometry" //These have been taken from "Realistic real-time grass rendering" by Eddie Lee, 2010 import bladeDiffuse from "./resources/blade_diffuse.jpg" import bladeAlpha from "./resources/blade_alpha.jpg" @@ -16,17 +15,17 @@ export default function Grass({ options = { bW: 0.12, bH: 1, joints: 5 }, width const materialRef = useRef() const [texture, alphaMap] = useLoader(THREE.TextureLoader, [bladeDiffuse, bladeAlpha]) const attributeData = useMemo(() => getAttributeData(instances, width), [instances, width]) - const baseGeom = useMemo(() => new THREE.PlaneBufferGeometry(bW, bH, 1, joints).translate(0, bH / 2, 0), [options]) + const baseGeom = useMemo(() => new THREE.PlaneGeometry(bW, bH, 1, joints).translate(0, bH / 2, 0), [options]) const groundGeo = useMemo(() => { - const geo = new Geometry().fromBufferGeometry(new THREE.PlaneGeometry(width, width, 32, 32)) - geo.verticesNeedUpdate = true + const geo = new THREE.PlaneGeometry(width, width, 32, 32) + geo.attributes.position.needsUpdate = true geo.lookAt(new THREE.Vector3(0, 1, 0)) - for (let i = 0; i < geo.vertices.length; i++) { - const v = geo.vertices[i] - v.y = getYPosition(v.x, v.z) + const positions = geo.attributes.position.array + for (let i = 0; i < positions.length; i+=3) { + positions[i+1] = getYPosition(positions[i], positions[i+2]) } geo.computeVertexNormals() - return geo.toBufferGeometry() + return geo }, [width]) useFrame(state => (materialRef.current.uniforms.time.value = state.clock.elapsedTime / 4)) return ( diff --git a/demos/grass-shader/src/GrassMaterial.js b/demos/grass-shader/src/GrassMaterial.js index e34d1611..4e9974b9 100755 --- a/demos/grass-shader/src/GrassMaterial.js +++ b/demos/grass-shader/src/GrassMaterial.js @@ -114,7 +114,7 @@ const GrassMaterial = shaderMaterial( gl_FragColor = col; #include - #include + #include }`, (self) => { self.side = THREE.DoubleSide