There is no normal display of water normal.

[datouzhan]

Hi,Long time no see.
I created a demo about the water false reflection in a separate threejs, which is displayed normally.

But when I transplanted to harpgl， it is failed.There is no normal display of water normal.

it is the shader
`WaterShader = {

uniforms: {

	'color': {
		type: 'c',
		value: null
	},

	'reflectivity': {
		type: 'f',
		value: 0
	},

	'tReflectionMap': {
		type: 't',
		value: null
	},

	'tRefractionMap': {
		type: 't',
		value: null
	},

	'tNormalMap0': {
		type: 't',
		value: null
	},

	'tNormalMap1': {
		type: 't',
		value: null
	},

	'textureMatrix': {
		type: 'm4',
		value: null
	},

	'config': {
		type: 'v4',
		value: new THREE.Vector4()
	}

},

vertexShader: [

	'#include <common>',
	'#include <fog_pars_vertex>',
	'#include <logdepthbuf_pars_vertex>',

	'uniform mat4 textureMatrix;',

	'varying vec4 vCoord;',
	'varying vec2 vUv;',
	'varying vec3 vToEye;',

	'void main() {',

	'	vUv = uv;',
	'	vCoord = textureMatrix * vec4( position, 1.0 );',

	'	vec4 worldPosition = modelMatrix * vec4( position, 1.0 );',
	'	vToEye = cameraPosition - worldPosition.xyz;',

	'	vec4 mvPosition =  viewMatrix * worldPosition;', // used in fog_vertex
	'	gl_Position = projectionMatrix * mvPosition;',

	'	#include <logdepthbuf_vertex>',
	'	#include <fog_vertex>',

	'}'

].join( '\n' ),

fragmentShader: [

	'#include <common>',
	'#include <fog_pars_fragment>',
	'#include <logdepthbuf_pars_fragment>',

	'uniform sampler2D tReflectionMap;',
	'uniform sampler2D tRefractionMap;',
	'uniform sampler2D tNormalMap0;',
	'uniform sampler2D tNormalMap1;',

	'#ifdef USE_FLOWMAP',
	'	uniform sampler2D tFlowMap;',
	'#else',
	'	uniform vec2 flowDirection;',
	'#endif',

	'uniform vec3 color;',
	'uniform float reflectivity;',
	'uniform vec4 config;',

	'varying vec4 vCoord;',
	'varying vec2 vUv;',
	'varying vec3 vToEye;',

	'void main() {',

	'	#include <logdepthbuf_fragment>',

	'	float flowMapOffset0 = config.x;',
	'	float flowMapOffset1 = config.y;',
	'	float halfCycle = config.z;',
	'	float scale = config.w;',

	'	vec3 toEye = normalize( vToEye );',

	// determine flow direction
	'	vec2 flow;',
	'	#ifdef USE_FLOWMAP',
	'		flow = texture2D( tFlowMap, vUv ).rg * 2.0 - 1.0;',
	'	#else',
	'		flow = flowDirection;',
	'	#endif',
	'	flow.x *= - 1.0;',

	// sample normal maps (distort uvs with flowdata)
	'	vec4 normalColor0 = texture2D( tNormalMap0, ( vUv * scale ) + flow * flowMapOffset0 );',
	'	vec4 normalColor1 = texture2D( tNormalMap1, ( vUv * scale ) + flow * flowMapOffset1 );',

	// linear interpolate to get the final normal color
	'	float flowLerp = abs( halfCycle - flowMapOffset0 ) / halfCycle;',
	'	vec4 normalColor = mix( normalColor0, normalColor1, flowLerp );',

	// calculate normal vector
	'	vec3 normal = normalize( vec3( normalColor.r * 2.0 - 1.0, normalColor.g * 2.0 - 1.0, normalColor.b) );',

	// calculate the fresnel term to blend reflection and refraction maps
	'	float theta = max( dot( toEye, normal ), 0.0 );',
	'	float reflectance = reflectivity + ( 1.0 - reflectivity ) * pow( ( 1.0 - theta ), 5.0 );',

	// calculate final uv coords
	'	vec3 coord = vCoord.xyz / vCoord.w;',
	'	vec2 uv = coord.xy + coord.z * normal.xz * 0.05;',

	'	vec4 reflectColor = texture2D( tReflectionMap, vec2( 1.0 - uv.x, uv.y ) );',
	'	vec4 refractColor = texture2D( tRefractionMap, uv );',

	// multiply water color with the mix of both textures
	'	gl_FragColor = vec4( color, 1.0 ) * mix( refractColor, reflectColor, reflectance );',

	'	#include <tonemapping_fragment>',
	'	#include <encodings_fragment>',
	'	#include <fog_fragment>',

	'}'

].join( '\n' )

};
`
I've been looking for it for a long time. I can't find the reason.Can u help me.

[FraukeF]

@datouzhan I see you closed the issue, did you find a solution?

[nzjony]

@datouzhan , I would also like to know if / how you fixed it.