How to fix the size of the mesh

Questions
,
1

I would like to fix the size of the mesh created with RawShaderMaterial, such as with the sizeattenuation option.

new three.RawShaderMaterial({
            uniforms: {
                color: {
                    value: new three.Color(0xff00ff),
                },
            },
            vertexShader: shaders.vertex,
            fragmentShader: shaders.fragment,
            depthTest: false,
            depthWrite: false,
            glslVersion: three.GLSL3,
            side: DoubleSide,
        });

export function createShader(instanceType: InstanceType, isPoint: boolean) {
    return {
        vertex: createVertexShader(instanceType, isPoint),
        fragment: `
            precision highp float;
            precision highp int;
            uniform vec3 color;
            out vec4 fragColor;
            void main() {
                fragColor = vec4(color, 1.0);
            }
            `,
    };
}

function createVertexShader(instanceType: InstanceType, isPoint: boolean) {
    return `
  precision highp float;
  precision highp int;
  in vec2 position;
  ${instanceType === InstanceType.FULL
            ? `
    /* First row. */
    in vec3 instanceTransform0;
    /* Second row. */
    in vec3 instanceTransform1;
    `
            : ''
        }
  ${instanceType === InstanceType.POINT
            ? `
  in vec2 instanceTransform;
  `
            : ''
        }
  uniform mat4 modelViewMatrix;
  uniform mat4 projectionMatrix;
  ${isPoint ? 'uniform float pointSize;' : ''}
  void main() {
      vec4 pos = vec4(position, 0.0, 1.0);
      ${instanceType === InstanceType.FULL
            ? `
        pos.xy = mat2(instanceTransform0[0], instanceTransform1[0],
                      instanceTransform0[1], instanceTransform1[1]) * pos.xy +
                 vec2(instanceTransform0[2], instanceTransform1[2]);
        `
            : ''
        }
      ${instanceType === InstanceType.POINT
            ? `
        pos.xy += instanceTransform;
        `
            : ''
        }
      gl_Position = projectionMatrix * modelViewMatrix * pos;
      ${isPoint ? 'gl_PointSize = pointSize;' : ''}
  }
  `;
}

Iā€™m curious how to write a shader to render a mesh of the same size regardless of camera distance.

2

you can try removing one of the elements in MVP
Or you can attach the object to the camera
Or you can get the offset of the object and camera and compute a scalar and apply it
You can do all of these in the shader or in the transform
It will however look like its stuck on the screen
You can also render it with a different camera in ortho and composite

1 Like