WebGL 由gl_FragCoord在FS中计算世界坐标（渲染流水线矩阵变化的逆推）

  今天有群友在交流群里问，如何根据gl_FragCoord在片元坐标中计算当前片元的世界坐标，因为能从顶点着色器传递到片元着色器，大家都没有在意这件事情，晚上正好无事也进行了一番探索，这是一个矩阵变换的逆过程。渲染管线中矩阵变换可参考我的这篇文章Webgl矩阵变换总结。
  话不多说直接，上效果，估计有点蒙，解释一下，初始是红色立方体，然后过两秒，开始进行比对，gl_FragCoord在片元着色器中计算世界的坐标和顶点着色器传递到片元着色的世界坐标，如果两者在一定误差范围内，立方体就会变成黄色，下图截取的是立方体的一部分。

  上着色器代码，vs和fs。

			precision mediump float;
			precision mediump int;

			uniform mat4 modelViewMatrix; // optional
			uniform mat4 projectionMatrix; // optional

			attribute vec3 position;

			varying vec3 vPosition;

			void main()	{
   

				vPosition = (modelViewMatrix * vec4( position, 1.0 )).xyz;

				gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );

			}

  顶点着色器部分比较简单，就是计算gl_Position和vPosition ，vPosition是相机空间的坐标，不是世界空间的坐标，偷个懒，变换到相机空间，也就能变换世界空间了，原理都一样。

			precision mediump float;
			precision mediump int;

			//投影矩阵的逆矩阵
      		uniform mat4 projectionMatrixInverse;
      		//视口变换矩阵的逆矩阵
			uniform mat4 viewPortMatrixInverse;

			//开始测试的标志
			uniform bool testFlag;

			varying vec3 vPosition;

			//在0.00001的误差范围内进行比较
			bool compare(float valueA,float  valueB){
   

        		if(valueA>(valueB-