fix: viewshed analysis throw an exception under the new version of we…

…bgl2
zouyaoji · Mar 13, 2023 · 4ca7ef5 · 4ca7ef5
1 parent 37275cb
commit 4ca7ef5
Show file tree

Hide file tree

Showing 10 changed files with 82 additions and 44 deletions.
diff --git a/packages/components/post-processes/post-process-stage-scan/use-circle-scan.ts b/packages/components/post-processes/post-process-stage-scan/use-circle-scan.ts
@@ -1,8 +1,8 @@
 /*
  * @Author: zouyaoji@https://github.com/zouyaoji
  * @Date: 2021-10-27 15:54:13
- * @LastEditTime: 2022-04-29 17:32:41
- * @LastEditors: zouyaoji
+ * @LastEditTime: 2023-03-09 09:53:21
+ * @LastEditors: zouyaoji [email protected]
  * @Description:
  * @FilePath: \vue-cesium@next\packages\components\post-processes\post-process-stage-scan\use-circle-scan.ts
  */
@@ -11,6 +11,15 @@ import shaderSource from '@vue-cesium/shared/shaders/CircleScan'
 export default function ($services: VcViewerProvider) {
   const webgl = options => {
     const { viewer } = $services
+
+    const webgl2 = viewer.scene.context?.webgl2
+    let shaderSourceText = shaderSource
+    if (!webgl2) {
+      shaderSourceText = shaderSourceText.replace('in vec2 v_textureCoordinates;', 'varying vec2 v_textureCoordinates;')
+      shaderSourceText = shaderSourceText.replace(/texture\(/g, 'texture2D(')
+      shaderSourceText = shaderSourceText.replace(/out_FragColor/g, 'gl_FragColor')
+    }
+
     const cartographicCenter = Cesium.Cartographic.fromCartesian(options.position, viewer.scene.globe.ellipsoid)
     const _Cartesian3Center = Cesium.Cartographic.toCartesian(cartographicCenter, viewer.scene.globe.ellipsoid)
     const _Cartesian4Center = new Cesium.Cartesian4(_Cartesian3Center.x, _Cartesian3Center.y, _Cartesian3Center.z, 1)
@@ -40,7 +49,7 @@ export default function ($services: VcViewerProvider) {
       u_scanColor: options.color
     }
     return {
-      shaderSource,
+      shaderSource: shaderSourceText,
       uniforms
     }
   }

diff --git a/packages/components/post-processes/post-process-stage-scan/use-radar-scan.ts b/packages/components/post-processes/post-process-stage-scan/use-radar-scan.ts
@@ -1,8 +1,8 @@
 /*
  * @Author: zouyaoji@https://github.com/zouyaoji
  * @Date: 2021-10-27 15:54:13
- * @LastEditTime: 2022-04-29 17:32:46
- * @LastEditors: zouyaoji
+ * @LastEditTime: 2023-03-09 14:05:49
+ * @LastEditors: zouyaoji [email protected]
  * @Description:
  * @FilePath: \vue-cesium@next\packages\components\post-processes\post-process-stage-scan\use-radar-scan.ts
  */
@@ -11,6 +11,14 @@ import shaderSource from '@vue-cesium/shared/shaders/RadarScan'
 export default function ($services: VcViewerProvider) {
   const webgl = options => {
     const { viewer } = $services
+
+    const webgl2 = $services.viewer.scene.context?.webgl2
+    let shaderSourceText = shaderSource
+    if (!webgl2) {
+      shaderSourceText = shaderSourceText.replace('in vec2 v_textureCoordinates;', 'varying vec2 v_textureCoordinates;')
+      shaderSourceText = shaderSourceText.replace(/texture\(/g, 'texture2D(')
+      shaderSourceText = shaderSourceText.replace(/out_FragColor/g, 'gl_FragColor')
+    }
     const cartographicCenter = Cesium.Cartographic.fromCartesian(options.position, viewer.scene.globe.ellipsoid)
     const _Cartesian3Center = Cesium.Cartographic.toCartesian(cartographicCenter, viewer.scene.globe.ellipsoid)
     const _Cartesian4Center = new Cesium.Cartesian4(_Cartesian3Center.x, _Cartesian3Center.y, _Cartesian3Center.z, 1)
@@ -67,7 +75,7 @@ export default function ($services: VcViewerProvider) {
       u_scanColor: options.color
     }
     return {
-      shaderSource,
+      shaderSource: shaderSourceText,
       uniforms
     }
   }

diff --git a/packages/components/primitives/tileset/index.ts b/packages/components/primitives/tileset/index.ts
@@ -234,7 +234,7 @@ export default defineComponent({
     const instance = getCurrentInstance() as VcComponentInternalInstance
     instance.cesiumClass = 'Cesium3DTileset'
     instance.cesiumEvents = ['allTilesLoaded', 'initialTilesLoaded', 'loadProgress', 'tileFailed', 'tileLoad', 'tileUnload', 'tileVisible']
-    usePrimitives(props, ctx, instance)
+    const primitivesStates = usePrimitives(props, ctx, instance)
     ;(instance.proxy as VcComponentPublicInstance).creatingPromise.then(obj => {
       const tileset = obj.cesiumObject as Cesium.Cesium3DTileset
       instance.removeCallbacks.push(tileset.tileVisible.addEventListener(updateTile))
@@ -263,9 +263,10 @@ export default defineComponent({
             sourceShaders[program.fragmentShader] = props.fragmentShader
           } else {
             const oldFS = sourceShaders[program.fragmentShader]
+            const webgl2 = primitivesStates.$services.viewer.scene.context?.webgl2
             sourceShaders[program.fragmentShader] = oldFS.replace(
-              'gl_FragColor = vec4(color, 1.0);\n}',
-              `gl_FragColor = vec4(color, 1.0);
+              `${webgl2 ? 'out_FragColor' : 'gl_FragColor'} = vec4(color, 1.0);\n}`,
+              `${webgl2 ? 'out_FragColor' : 'gl_FragColor'}  = vec4(color, 1.0);
              ${props.fragmentShader}\n}
             `
             )

diff --git a/packages/components/primitives/viewshed/index.ts b/packages/components/primitives/viewshed/index.ts
@@ -53,8 +53,7 @@ export const viewshedProps = {
     type: Object as PropType<Cesium.Cartesian3>
   },
   fragmentShader: {
-    type: String,
-    default: fragmentShader
+    type: String
   },
   uniforms: Object
 }
@@ -241,9 +240,17 @@ export default defineComponent({
       const viewshed = instance.cesiumObject as Viewshed
       const { Cartesian4, PostProcessStage, Cartesian2 } = Cesium
 
+      const webgl2 = commonState.$services.viewer.scene.context?.webgl2
+      let shaderSourceText = fragmentShader
+      if (!webgl2) {
+        shaderSourceText = shaderSourceText.replace('in vec2 v_textureCoordinates;', 'varying vec2 v_textureCoordinates;')
+        shaderSourceText = shaderSourceText.replace(/texture\(/g, 'texture2D(')
+        shaderSourceText = shaderSourceText.replace(/out_FragColor/g, 'gl_FragColor')
+      }
+
       updateViewshed(props.startPosition, props.endPosition)
       attachedViewshedStage = new PostProcessStage({
-        fragmentShader: props.fragmentShader,
+        fragmentShader: props.fragmentShader || shaderSourceText,
         uniforms: props.uniforms || {
           u_color1: function () {
             return viewshed.visibleColor

diff --git a/packages/composables/use-primitives/index.ts b/packages/composables/use-primitives/index.ts
@@ -116,6 +116,7 @@ export default function (props, ctx, vcInstance: VcComponentInternalInstance) {
   return {
     transformProps: commonState.transformProps,
     unwatchFns: commonState.unwatchFns,
-    setPropsWatcher: commonState.setPropsWatcher
+    setPropsWatcher: commonState.setPropsWatcher,
+    $services: commonState.$services
   }
 }
diff --git a/packages/shared/extends/scene/ShadowMapShaderExtend.ts b/packages/shared/extends/scene/ShadowMapShaderExtend.ts
@@ -1,8 +1,8 @@
 /*
  * @Author: zouyaoji@https://github.com/zouyaoji
  * @Date: 2022-04-16 19:29:57
- * @LastEditTime: 2022-05-13 09:49:41
- * @LastEditors: zouyaoji
+ * @LastEditTime: 2023-03-03 17:49:19
+ * @LastEditors: zouyaoji [email protected]
  * @Description:
  * @FilePath: \vue-cesium@next\packages\shared\extends\scene\ShadowMapShaderExtend.ts
  */
@@ -30,12 +30,15 @@ export default class ShadowMapShaderExtend {
           uniform vec4 shadowMap_viewshedInvisibleColor;
           ${fs.sources[0]}
         `
+        const webgl2 = viewer.scene.context?.webgl2
         fs.sources[fs.sources.length - 1] = fs.sources[fs.sources.length - 1].replace(
-          'gl_FragColor.rgb *= visibility;',
+          `${webgl2 ? 'out_FragColor' : 'gl_FragColor'}.rgb *= visibility;`,
           `
           float _depth = shadowPosition.z - shadowParameters.depthBias;
           float _visibility = czm_shadowDepthCompare(shadowMap_texture, shadowPosition.xy, _depth);
-          gl_FragColor.rgb *= (_visibility < 0.999 ? shadowMap_viewshedInvisibleColor.rgb :shadowMap_viewshedVisibleColor.rgb);
+          ${
+            webgl2 ? 'out_FragColor' : 'gl_FragColor'
+          }.rgb *= (_visibility < 0.999 ? shadowMap_viewshedInvisibleColor.rgb :shadowMap_viewshedVisibleColor.rgb);
           `
         )
         fs.sources[fs.sources.length - 1] = fs.sources[fs.sources.length - 1].replace(

diff --git a/packages/shared/shaders/CircleScan.ts b/packages/shared/shaders/CircleScan.ts
@@ -1,7 +1,7 @@
 export default `
   uniform sampler2D colorTexture;
   uniform sampler2D depthTexture;
-  varying vec2 v_textureCoordinates;
+  in vec2 v_textureCoordinates;
   uniform vec4 u_scanCenterEC;
   uniform vec3 u_scanPlaneNormalEC;
   uniform float u_radius;
@@ -29,16 +29,16 @@ export default `
   }
   void main()
   {
-    gl_FragColor = texture2D(colorTexture, v_textureCoordinates);
-    float depth = getDepth( texture2D(depthTexture, v_textureCoordinates));
+    out_FragColor = texture(colorTexture, v_textureCoordinates);
+    float depth = getDepth( texture(depthTexture, v_textureCoordinates));
     vec4 viewPos = toEye(v_textureCoordinates, depth);
     vec3 prjOnPlane = pointProjectOnPlane(u_scanPlaneNormalEC.xyz, u_scanCenterEC.xyz, viewPos.xyz);
     float dis = length(prjOnPlane.xyz - u_scanCenterEC.xyz);
     if(dis < u_radius)
     {
       float f = 1.0 -abs(u_radius - dis) / u_radius;
       f = pow(f, 4.0);
-      gl_FragColor = mix(gl_FragColor, u_scanColor, f);
+      out_FragColor = mix(out_FragColor, u_scanColor, f);
     }
   }
 `
diff --git a/packages/shared/shaders/RadarScan.ts b/packages/shared/shaders/RadarScan.ts
@@ -1,7 +1,15 @@
+/*
+ * @Author: zouyaoji [email protected]
+ * @Date: 2023-02-18 13:40:49
+ * @LastEditors: zouyaoji [email protected]
+ * @LastEditTime: 2023-03-09 14:12:24
+ * @FilePath: \vue-cesium@next\packages\shared\shaders\RadarScan.ts
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
 export default `
   uniform sampler2D colorTexture;
   uniform sampler2D depthTexture;
-  varying vec2 v_textureCoordinates;
+  in vec2 v_textureCoordinates;
   uniform vec4 u_scanCenterEC;
   uniform vec3 u_scanPlaneNormalEC;
   uniform vec3 u_scanLineNormalEC;
@@ -43,8 +51,8 @@ export default `
   }
   void main()
   {
-    gl_FragColor = texture2D(colorTexture, v_textureCoordinates);
-    float depth = getDepth( texture2D(depthTexture, v_textureCoordinates));
+    out_FragColor = texture(colorTexture, v_textureCoordinates);
+    float depth = getDepth( texture(depthTexture, v_textureCoordinates));
     vec4 viewPos = toEye(v_textureCoordinates, depth);
     vec3 prjOnPlane = pointProjectOnPlane(u_scanPlaneNormalEC.xyz, u_scanCenterEC.xyz, viewPos.xyz);
     float dis = length(prjOnPlane.xyz - u_scanCenterEC.xyz);
@@ -61,7 +69,7 @@ export default `
         f = abs(twou_radius -dis1) / twou_radius;
         f = pow(f, 3.0);
       }
-      gl_FragColor = mix(gl_FragColor, u_scanColor, f + f0);
+      out_FragColor = mix(out_FragColor, u_scanColor, f + f0);
     }
   }
 `
diff --git a/packages/shared/shaders/Viewshed.ts b/packages/shared/shaders/Viewshed.ts
@@ -1,8 +1,8 @@
 /*
  * @Author: zouyaoji@https://github.com/zouyaoji
  * @Date: 2022-04-29 17:43:24
- * @LastEditTime: 2022-05-13 14:43:03
- * @LastEditors: zouyaoji
+ * @LastEditTime: 2023-03-09 16:36:44
+ * @LastEditors: zouyaoji [email protected]
  * @Description:
  * @FilePath: \vue-cesium@next\packages\shared\shaders\Viewshed.ts
  */
@@ -25,7 +25,7 @@ export default `
   uniform vec3 shadowMap_lightUp;
   uniform vec3 shadowMap_lightDir;
   uniform vec3 shadowMap_lightRight;
-  varying vec2 v_textureCoordinates;
+  in vec2 v_textureCoordinates;
   vec4 toEye(in vec2 uv, in float depth){
     vec2 xy = vec2((uv.x * 2.0 - 1.0),(uv.y * 2.0 - 1.0));
     vec4 posInCamera = czm_inverseProjection * vec4(xy, depth, 1.0);
@@ -40,7 +40,7 @@ export default `
     return (2.0 * z_window - n_range - f_range) / (f_range - n_range);
   }
   float _czm_sampleShadowMap(sampler2D shadowMap, vec2 uv){
-    return texture2D(shadowMap, uv).r;
+    return texture(shadowMap, uv).r;
   }
   float _czm_shadowDepthCompare(sampler2D shadowMap, vec2 uv, float depth){
     return step(depth, _czm_sampleShadowMap(shadowMap, uv));
@@ -85,11 +85,11 @@ export default `
   void main()
   {
     const float PI = 3.141592653589793;
-    vec4 color = texture2D(colorTexture, v_textureCoordinates);
-    gl_FragColor = color;
+    vec4 color = texture(colorTexture, v_textureCoordinates);
+    out_FragColor = color;
     if ( u_isShed < 0.5 )
         return;
-    vec4 currD = texture2D(czm_globeDepthTexture, v_textureCoordinates);
+    vec4 currD = texture(czm_globeDepthTexture, v_textureCoordinates);
     if( currD.r >= 1.0 )
         return;
 
@@ -119,13 +119,13 @@ export default `
     shadowParameters.nDotL = nDotL;
     float visibility = _czm_shadowVisibility(shadowMap_depthTexture, shadowParameters);
     if(visibility > 0.3 ){
-      gl_FragColor = mix(color,vec4(u_color1.rgb, 1.0),mixNum);
+      out_FragColor = mix(color,vec4(u_color1.rgb, 1.0),mixNum);
     }
     else{
       if(abs(shadowPosition.z-0.0)<0.01){
         return;
       }
-      gl_FragColor = mix(color,vec4(u_color2.rgb, 1.0),mixNum);
+      out_FragColor = mix(color,vec4(u_color2.rgb, 1.0),mixNum);
     }
   }
 `
diff --git a/packages/shared/src/DebugCameraPrimitive.ts b/packages/shared/src/DebugCameraPrimitive.ts
@@ -1,8 +1,8 @@
 /*
  * @Author: zouyaoji@https://github.com/zouyaoji
  * @Date: 2022-04-17 22:17:16
- * @LastEditTime: 2022-05-14 15:22:31
- * @LastEditors: zouyaoji
+ * @LastEditTime: 2023-03-09 18:00:52
+ * @LastEditors: zouyaoji [email protected]
  * @Description:
  * @FilePath: \vue-cesium@next\packages\shared\src\DebugCameraPrimitive.ts
  */
@@ -162,18 +162,19 @@ class DebugCameraPrimitive {
     const indexTypedArray2 = generateIndices2(this._segmentH, this._segmentV, this._subSegmentH, this._subSegmentV)
     const appearance = Appearance['getDefaultRenderState'](true, false, undefined)
     const renderState = RenderState.fromCache(appearance)
+    const webgl2 = context.webgl2
     const vs = new ShaderSource({
       sources: [
         `
         // 使用double类型的position进行计算
         // attribute vec3 position3DHigh;
         // attribute vec3 position3DLow;
-        attribute vec3 position;
-        attribute vec3 normal;
+        ${webgl2 ? 'in' : 'attribute'} vec3 position;
+        ${webgl2 ? 'in' : 'attribute'} vec3 normal;
         // attribute vec2 st;
         // attribute float batchId;
-        varying vec3 v_positionEC;
-        varying vec3 v_normalEC;
+        ${webgl2 ? 'out' : 'varying'} vec3 v_positionEC;
+        ${webgl2 ? 'out' : 'varying'} vec3 v_normalEC;
         // varying vec2 v_st;
         void main()
           {
@@ -198,8 +199,8 @@ class DebugCameraPrimitive {
     const fs = new ShaderSource({
       sources: [
         `
-        varying vec3 v_positionEC;
-        varying vec3 v_normalEC;
+        ${webgl2 ? 'in' : 'varying'} vec3 v_positionEC;
+        ${webgl2 ? 'in' : 'varying'} vec3 v_normalEC;
         // varying vec2 v_st;
         // uniform sampler2D myImage;
         uniform vec4 vcColor;
@@ -220,9 +221,9 @@ class DebugCameraPrimitive {
           material.diffuse = vcColor.rgb;
           material.alpha = vcColor.a;
           #ifdef FLAT
-          gl_FragColor = vec4(material.diffuse + material.emission, material.alpha);
+          ${webgl2 ? 'out_FragColor' : 'gl_FragColor'} = vec4(material.diffuse + material.emission, material.alpha);
           #else
-          gl_FragColor = czm_phong(normalize(positionToEyeEC), material, czm_lightDirectionEC);
+          ${webgl2 ? 'out_FragColor' : 'gl_FragColor'} = czm_phong(normalize(positionToEyeEC), material, czm_lightDirectionEC);
           #endif
         }
         `