在片段坐标着色器中使用UV坐标查找屏幕像素的大小

Question

我有一个非常详细的纹理（带有错误的颜色信息，我正在使用片段着色器中的错误颜色查找进行渲染）。我的问题是，有时用户会缩放远离此纹理，并且细节会丢失：纹理中的细线无法看到。我想修改我的代码以使这些行弹出。

我的想法是，我可以对相邻的Textels运行快速筛选，并选择最大/最小/最有趣的值进行渲染。我不确定该怎么做才能确定是否（和多少）这样做。当用户放大到三角形时，我需要标准查找。当它们缩小时，屏幕上的单个像素映射到许多纹理像素。

我如何估算呢？我同时使用正射和透视相机。

我的想法是，我可以以某种方式使用顶点着色器来估计UV屏幕中一个屏幕像素的大小，并将其作为片段着色器的变量传递给我，但是我仍然对这一问题没有足够的了解足够的变换和空间来理解这个想法。

我当前的顶点着色器非常简单：

  varying vec2 vUv;
  varying vec3 vPosition;
  varying vec3 vNormal;
  varying vec3 vViewDirection;

   void main() {
       vUv = uv;
       vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
       vPosition = (modelMatrix *
           vec4(position,1.0)).xyz;
       gl_Position = projectionMatrix * mvPosition;
      vec3 transformedNormal = normalMatrix *  vec3( normal );
      vNormal = normalize( transformedNormal );
      vViewDirection = normalize(mvPosition.xyz);
   }

如何获得类似vDeltaUV的图像，它以UV单位给出屏幕像素之间的距离？

约束：我正在three.js中的WebGL中工作。

这是一张图像的示例，其中用户将透视图缩放到接近我的纹理：

这里是相同的示例，但是缩小了；上面的特征是在中心附近几乎看不到的对角线（请参阅坐标以获取比例感）。我希望通过渲染具有相应文本数组阵列的最红色的所有像素来弹出此行。

Answer 1

您无法在顶点着色器中执行此操作，因为它处于栅格化前阶段，因此输出分辨率不可知，但是在片段着色器中，您可以使用GL_OES_standard_derivatives扩展名来使用dFdx, dFdy and fwidth （几乎到处都可以找到它）来估计采样足迹。

如果您不实时更新纹理，则一种更简单，更有效的解决方案是在CPU上为其生成自定义Mip级别。