'How I can fix this black hole I get when trying to do 2d lighting using normal maps?

I have the following shader to draw lightning into 2D quads with normal maps

in vec2 position;
in vec2 texturePosition;

out vec4 fragColor;

layout(std140)  uniform ubo {
  mat4 uCameraView;
  vec3 uLightPosition;
};

uniform sampler2D uTexture0;
uniform sampler2D uTexture1;

// TODO: move into the ubo
const vec4 uLightColor = vec4(1.f, 1.f, 1.f, 1.f);
const vec4 uAmbientColor = vec4(0.2f, 0.2f, 0.2f, 0.2f);
const vec3 uFalloff = vec3(0.1f, 3.f, 20.f);

void main() {
  vec4 difusseColor = texture(uTexture0, texturePosition);
  vec3 normalMap = texture(uTexture1, texturePosition).rgb;
  normalMap.y *= -1;

  vec3 lightDirection = vec3(uLightPosition.xy - position.xy, uLightPosition.z);
  float direction = length(lightDirection);
  vec3 light = normalize(lightDirection);
  vec3 normal = normalize(normalMap * 2.f - 1.f);

  vec3 diffuseLight = (uLightColor.rgb * uLightColor.a) * dot(normal, light);

  vec3 ambient = uAmbientColor.rgb * uAmbientColor.a;
  float attenuation = 1.f /
    (uFalloff.x + (uFalloff.y * direction) +
     (uFalloff.z * direction * direction));

  vec3 intensity = ambient + diffuseLight * attenuation;
  vec3 color = difusseColor.rgb * intensity;

  fragColor = vec4(color, difusseColor.a);
}

But the issue I get is this black hole behind the light

enter image description here

I can remove the black hole with this line of code

vec3 diffuseLight = (uLightColor.rgb * uLightColor.a) * max(dot(normal, light), 0.0f);

But then I get this misaligned light without illumination where the black hole was

enter image description here

This is my vertex shader

void main() {
  gl_Position = uCameraView * vec4(vPosition, 0.f, 1.f);
}

uCameraView is a mat4 perspective projection that is done like this

glm::vec3 camera;
glm::mat4 projection =
  glm::perspective(glm::radians(45.f), app.aspectRatio, 0.f, 100.f);
projection = glm::scale(projection, size.viewport.scale);
glm::mat4 view = glm::translate(projection, camera);

Is this possible to fix?

I tried following this tutorial https://github.com/mattdesl/lwjgl-basics/wiki/ShaderLesson6 and in there the light look good.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source