Trzy predefiniowane atrybuty shader / Uniform

To pytanie zyskało sporo odsłon, a użytkownik Killah wspomniał, że istniejące odpowiedzi nie doprowadziły już do rozwiązania z obecną wersją trzech.js. Dlatego próbowałem ponownie rozwiązać problem i chciałbym przedstawić kilka opcji, które znalazłem: {]}

• Najszybszym i najłatwiejszym sposobem (choć niezbyt eleganckim) jest po prostu umieszczenie przypadkowego błędu w shaderze. Pojawi się błąd konsoli z całym kodem shader, w tym wszystkim, co trzy.js dodaje.

• Lepszym rozwiązaniem jest wyjście źródła shadera z miejsca jego kompilacji, czyli trzech.WebGLShader (od obecnych 3.wersja js, r68). Zrobiłem szybkie kopiowanie i wklejanie, które powinny wyprowadzać wszystkie źródła shaderów przed ich kompilacją.

  Dodaj to po włączeniu trzech.js i przed własnym kodem:

  THREE.WebGLShader = ( function () {
      var addLineNumbers = function ( string ) {
          var lines = string.split( '\n' );
          for ( var i = 0; i < lines.length; i ++ ) {
              lines[ i ] = ( i + 1 ) + ': ' + lines[ i ];
          }
          return lines.join( '\n' );
      };
      return function ( gl, type, string ) {
          var shader = gl.createShader( type ); 
          console.log(string);
          gl.shaderSource( shader, string );
          gl.compileShader( shader );
          if ( gl.getShaderParameter( shader, gl.COMPILE_STATUS ) === false ) {
              console.error( 'THREE.WebGLShader: Shader couldn\'t compile.' );
          }
          if ( gl.getShaderInfoLog( shader ) !== '' ) {
              console.warn( 'THREE.WebGLShader: gl.getShaderInfoLog()', gl.getShaderInfoLog( shader ) );
              console.warn( addLineNumbers( string ) );
          }
          return shader;
      };
  } )();
  

  Zauważ, że ten fragment jest po prostu skopiowany (i bardzo nieznacznie zmieniony) z trzech.źródła js i powinny być usunięte przed faktycznie używając kodu. Tylko do debugowania!

• Jest jeszcze jedna opcja, która jest mniej inwazyjna: możesz sprawdzić swój ShaderMaterial po utworzeniu i renderowaniu go przynajmniej raz, w ten sposób:

  var material = new THREE.ShaderMaterial({
      uniforms: {
          uColorMap: { type: 't', value: THREE.ImageUtils.loadTexture('./img/_colors.png') },
          uSpecularMap: { type: 't', value: THREE.ImageUtils.loadTexture('./img/_spec.png') }, 
          uNormalMap: { type: 't', value: THREE.ImageUtils.loadTexture('./img/_normal.png') }
      },
      vertexShader: document.getElementById('vShader').innerText,
      fragmentShader: document.getElementById('fShader').innerText
  });
  

  Następnie, Po renderowanie obiektu przynajmniej raz:

  console.log(material.program.attributes);
  console.log(material.program.uniforms);