Question

我的应用程序是具有某些形状的世界地图。用户可以拖动和缩放地图以进行导航。

世界界限协调是minX = -180 minY = -90 maxX = 180 maxY = 90。我的形状顶点也在这个坐标范围内。

我使用正交投影将世界映射到屏幕。当用户拖动或缩放时，我只需使用新的可见地图边界更改矩阵。

应用程序运行良好，用户可以缩放并拖动地图。形状正在相应地移动。

我使用lighgl作为第三方

当用户放大分配时会出现问题，然后我的形状顶点开始抖动并在某些时候消失。我很确定这是浮点精度问题。因为当我们放大可见区域时，边界非常小 - 例如。 minx：30.0001 - maxX：30.0002，以及y。

我的着色器是基本着色器，如下所示：

顶点着色器

uniform mat4 gl_ModelViewProjectionMatrix;    
attribute vec4 gl_Vertex;
 
void main() {
   gl_Position = gl_ModelViewProjectionMatrix * gl_Vertex;
}

片段着色器

void main() {
  gl_FragColor = vec4(1.,0.,0.,1.);
}

我正在为这个问题寻找数学或webGL解决方案..

尝试1：

我试图通过因子扩展所有内容，但由于某种原因它没有起作用。

对于前。而不是映射minX：30.001它将映射minx：3000.1 - 因子100（依此类推其余的边界值）。在我的着色器中，我将gl_Vertex乘以此因子。但它看起来一样。

Answer 1

经过多次尝试并检查浮点如何工作，我意识到当我的浮点值在-1到1之间时，精度非常高。在+/-1.e-45附近。

所以我基本上做的是将我的映射偏移到原点 - 我的中间点将是（0,0）。等等顶点出现在着色器中。

对于Ex。如果我们的世界地图显示30.999999990到30.999999996之间的区域（在X和Y中），则映射此值将基本上映射圆值 - 40到40浮动精度。

为了解决它，我们如前所述抵消了原点。这意味着，30.999999993是映射值的中间，我用它来减少它们。现在将-0.000000003映射到0.000000003 - 这些值在float中是可接受的。

我们的整数（如果这是正确的单词）是0，因此现在可以为分数提供更多位。

在着色器中，我也从顶点减少了这个中间值（30.999999993）..

希望帮助了这个答案。

我已使用此link来帮助我理解