на плоскости (planeMesh) не отображается текстура const texture = new THREE.TextureLoader().load('gradient-1.png');
в чем ошибка?
html:
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Vite App</title>
    <style>
      body {margin: 0; }
    </style>
  </head>
  <body>
    <script id="fragShader" type="shader-code">
      uniform vec2 res;
      uniform sampler2D tex;
      uniform vec3 mouseCoord;
      uniform float speed;
      // * 0.5625

      vec2 rotateCoord(vec2 pixel, float pi, vec2 mouse, float distFactor) {
          vec2 uv = pixel - mouse;
          vec2 mNew;
          mNew.x = cos(pi)*mouse.x + sin(pi)*mouse.y;
          mNew.y = -sin(pi)*mouse.x + cos(pi)*mouse.y;

          //Сила закручивания
          float powerRotate = 0.10;

          //Поворачиваем координаты
          vec2 uvNew;
          distFactor = pow(distFactor,2.0)/(1.0/powerRotate);
          uvNew.x = cos(pi*distFactor)*uv.x + sin(pi*distFactor)*uv.y;
          uvNew.y = -sin(pi*distFactor)*uv.x + cos(pi*distFactor)*uv.y;
          uvNew -= mNew;
          return uvNew;
      }


      void main() {
          float pi = 3.1415926535;
          vec3 color;
          vec2 pixel = gl_FragCoord.xy / res.xy;
          vec2 mouse = mouseCoord.xy / res.xy;
          float dist = distance(gl_FragCoord.xy,mouseCoord.xy);
          float r = mouseCoord.z * 4.0;
          float distFactor = 1.0 - dist / r;
          vec2 uvNew = rotateCoord( pixel, pi, mouse, distFactor);
          
          vec4 te;
          if(dist<r) {
              distFactor = pow(distFactor,2.0) * 2.264;
              te.r = texture2D(tex,uvNew-0.0001*speed*(distFactor)).r;
              te.g = texture2D(tex,uvNew).g;
              te.b = texture2D(tex,uvNew+0.0001*speed*(distFactor)).b;
              color = te.rgb ;
          } else {
              te = texture2D(tex,pixel);
              color = te.rgb + distFactor * 0.0016;
          }
          gl_FragColor = vec4(color,1.0);
     }
  </script>
    <script type="module" src="main.js"></script>
  </body>
</html>

js:
import * as THREE from 'three';
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader';
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls'

const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
camera.position.z = 5;

const renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);

const controls = new OrbitControls( camera, renderer.domElement );
controls.enableZoom = false;

controls.enableDamping = true; 
controls.dampingFactor = 0.05; 

const shaderCode = document.getElementById("fragShader").innerHTML;
THREE.ImageUtils.crossOrigin = '';
const texture = new THREE.TextureLoader().load('gradient-1.png');



const loader = new GLTFLoader();
const url = 'GRAF_3_23.glb';

loader.load(url, function (gltf) {
  const model = gltf.scene;

  model.traverse((child) => {
    if (child.isMesh) {
      const geometry = child.geometry;

      const texturePoint = new THREE.TextureLoader().load('texture3.png');
      
      const sizeVariation = 0.001;

      const geometryPoint = new THREE.BufferGeometry();

      const positions = geometry.getAttribute('position').array;

      
      const randomSize = [];
      for (let i = 0; i < positions.length; i += 3) {
        const startSize = 0.006;
        const size = startSize + (Math.random() * sizeVariation);
        randomSize.push(size, size, size); // каждый размер - это три компоненты размера в формате [x, y, z] 
      }
      // let startSize = 0.06;
      
      const materialPoint = new THREE.PointsMaterial({
        size: 0.03,
        sizeAttenuation: true,
        map: texturePoint,
        alphaTest: 0.01,
        transparent: true,
        color: new THREE.Color(1., 1., 1.),
        opacity: 1.
      });
      
      const sizes = new Float32Array(randomSize);
      geometryPoint.setAttribute('size', new THREE.BufferAttribute(sizes, 1));

      const randomPosition = [];
      for (let i = 0; i < positions.length; i += 3) {
        randomPosition.push(10.0*Math.random()-5.0, 10.0*Math.random()-5.0, 10.0*Math.random()-5.0);
      }
      const randomPositionCopy = [...randomPosition];

      let increment = 0.002;
   
      geometryPoint.setAttribute('position', new THREE.Float32BufferAttribute(positions, 3));

      const points = new THREE.Points(geometryPoint, materialPoint);


      geometry.setAttribute('position', new THREE.BufferAttribute(new Float32Array(randomPosition), 3));
      function updateArray(increment) {
        for(let j = 0; j < 75; j++) {
          for(let i = 0; i<randomPosition.length; i++) {
            if (randomPosition[i] < positions[i]) {
              randomPosition[i] = randomPosition[i] + increment;
            } else if(randomPosition[i] > positions[i]) {
              randomPosition[i] = randomPosition[i] - increment;
            } else if((randomPosition[i] - positions[i]) < 0.002) {
              randomPosition[i] = positions[i];
            }
          }
        }
        geometryPoint.setAttribute('position', new THREE.BufferAttribute(new Float32Array(randomPosition), 3));
      }
      function reverseUpdateArray(increment) {
        for(let j = 0; j < 75; j++) {
          for(let i = 0; i<randomPosition.length; i++) {
            if (randomPosition[i] < randomPositionCopy[i]) {
              randomPosition[i] = randomPosition[i] + increment;
            } else if(randomPosition[i] > randomPositionCopy[i]) {
              randomPosition[i] = randomPosition[i] - increment;
            } else if((randomPosition[i] - randomPositionCopy[i]) < 0.002) {
              randomPosition[i] = randomPositionCopy[i];
            }
          }
        }
        geometryPoint.setAttribute('position', new THREE.BufferAttribute(new Float32Array(randomPosition), 3));
      }

      let time = 0;
      let sinPosition;
      let sinPosition2;
      let cosPosition;
      let randSignArray = [];
      let sign;
      let ratio = 1.0;

      for(let i = 0; i<randomPosition.length; i++) {
        sign = Math.random() < 0.5 ? -1.0 : 1.0;
        randSignArray[i] = sign;
      }
      geometryPoint.setAttribute('position', new THREE.BufferAttribute(new Float32Array(randomPosition), 3));

      window.addEventListener('wheel', function(event) {
        if (event.deltaY > 0) {
          updateArray(increment);
          if(ratio > 0.0) {
            ratio -= 0.01;
          }
        } else {
          reverseUpdateArray(increment);
          ratio += 0.01;
        }

      });


      scene.add(points);
      points.rotateX(Math.PI/2.0);
    }
  });
  camera.position.z = 3;



// ________________________________________________________________________________________________________________________________________________

    // Создаем переменные для точки и радиуса
  let point = new THREE.Vector3(0, 0, 0);
  let radius = 1;

  // Создаем функцию для генерации случайной точки внутри заданного радиуса
  function generateRandomPointInRadius(radius) {
    let angle1 = Math.random() * 2 * Math.PI;
    let angle2 = Math.random() * 2 * Math.PI;
    let x = radius * Math.sin(angle1) * Math.cos(angle2);
    let y = radius * Math.sin(angle1) * Math.sin(angle2);
    let z = radius * Math.cos(angle1);
    return new THREE.Vector3(x, y, z);
  }

  // Инициализируем переменные для генерации случайной точки
  let randomPoint = generateRandomPointInRadius(radius);
  let dist = point.distanceTo(randomPoint);
  let t = 0;

  // Создаем функцию для анимации точки
  function animatePoint() {
    t += 0.01;
    if (t > 1) {
      randomPoint = generateRandomPointInRadius(radius);
      dist = point.distanceTo(randomPoint);
      t = 0;
    }
    let newPos = point.clone().lerp(randomPoint, t);
    let moveDist = newPos.distanceTo(point);
    if (moveDist >= dist) {
      randomPoint = generateRandomPointInRadius(radius);
      dist = point.distanceTo(randomPoint);
      t = 0;
    }
    point.copy(newPos);
  }

  // Добавляем точку на сцену
  let pointGeometry = new THREE.SphereGeometry(0.2, 32, 32);
  let pointMaterial = new THREE.MeshBasicMaterial({color: 0xff0000});
  let pointMesh = new THREE.Mesh(pointGeometry, pointMaterial);
  pointMesh.position.set(point.x, point.y, point.z);
  scene.add(pointMesh);

// ________________________________________________________________________________________________________________________________________________


// ________________________________________________________________________________________________________________________________________________
let uniforms = {
  mouseCoord: {type:'v3', value: new THREE.Vector3()},
  tex: { type:'t', value:texture },
  res: { type:'v2', value:new THREE.Vector2(window.innerWidth,window.innerHeight)}
};
console.log(texture);
  const planeGeometry = new THREE.PlaneGeometry(100, 100);
  const planeMaterial = new THREE.ShaderMaterial({uniforms:uniforms, fragmentShader:shaderCode});
  const planeMesh = new THREE.Mesh(planeGeometry, planeMaterial);
  scene.add(planeMesh);


  controls.addEventListener('change', function() {
    planeMesh.quaternion.copy(camera.quaternion);
  });

  let targetX = 0;
  let targetY = 0;
  let currentX = 0;
  let currentY = 0;

  function update() {
      requestAnimationFrame(update);
      const diffX = targetX - currentX;
      const diffY = targetY - currentY;
      const distance = Math.sqrt(diffX * diffX + diffY * diffY);
      const speed = distance / 10;
      if (distance < 1.0) {
          currentX = targetX;
          currentY = targetY;
      } else {
          currentX += speed * diffX / distance;
          currentY += speed * diffY / distance;
      }
  }
  update();

  document.addEventListener('mousemove', (event) => {
    targetX = event.clientX;
    targetY = event.clientY;
    uniforms.mouseCoord.value.x = currentX;
    uniforms.mouseCoord.value.y = -currentY + window.innerHeight;
  });


  function animate() {
  requestAnimationFrame(animate);
  animatePoint();
  pointMesh.position.set(point.x, point.y, point.z);
  controls.update();
  uniforms.mouseCoord.value.x = currentX;
  uniforms.mouseCoord.value.y = -currentY + window.innerHeight;
  renderer.render(scene, camera);
  }
  animate();
});