# Artifact appearing on large plane

**URL:** <https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358>\
**Category:** Questions\
**Created:** [July 9, 2020, 10:47pm UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358 "2020-07-09T22:47:54Z")\
**Posts on this page:** 16\
**Page:** 1

<div class="post-metadata">

**Author:** ![Tyzor](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/tyzor/32/1432_2.png) [@Tyzor](https://forum.babylonjs.com/u/Tyzor)\
**Post date:** [July 9, 2020, 10:47pm UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358/1 "2020-07-09T22:47:54Z")

</div>

I’ve run into a bizarre issue happening when playing with camera settings and a large plane (size 1000). At specific camera positions a line appears through the origin of the plane. I’ve screenshot an example below.

![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/1/1feaf6c28ee246c2bf0cbf3daa8631616ccf5bd4.png)

If I resize the browser window and change the canvas size it goes away. I’ve tried to recreate the issue as best I can in the playground ([https://www.babylonjs-playground.com/#339A8H](https://www.babylonjs-playground.com/#339A8H). I have manually set the camera position to the problem but it will likely only appear if the window is maximized.

I’m assuming this has to do with Z fighting in some way? But the plane has nothing really to clip with except itself.

Anyone have any ideas for how to solve this?

---

<div class="post-metadata">

**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\
**Post date:** [July 10, 2020, 5:46pm UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358/2 "2020-07-10T17:46:09Z")

</div>

I do not repro here ☹

---

<div class="post-metadata">

**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\
**Post date:** [July 10, 2020, 5:47pm UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358/3 "2020-07-10T17:47:01Z")

</div>

Can you test without the creating of the GridMaterial to try to isolate the issue?

---

<div class="post-metadata">

**Author:** ![syntheticmagus](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/syntheticmagus/32/395_2.png) [@syntheticmagus](https://forum.babylonjs.com/u/syntheticmagus)\
**Post date:** [July 10, 2020, 6:23pm UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358/4 "2020-07-10T18:23:26Z")

</div>

Hi Tyzor,

I also do not repro. In addition to isolating by removing the GridMaterial, if you can reproduce the artifact while using [Spector.js](https://spector.babylonjs.com/), you should be able to look through the draw calls and see exactly what part of the rendering is causing that artifact to appear.

---

<div class="post-metadata">

**Author:** ![Dad72](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/dad72/32/13_2.png) [@Dad72](https://forum.babylonjs.com/u/Dad72)\
**Post date:** [July 10, 2020, 7:16pm UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358/5 "2020-07-10T19:16:59Z")

</div>

I can see the problem at home. I tried to remove the GridMaterial and the problem still exists.

This happens at a precise angle of the camera (when loading the current scene)

---

<div class="post-metadata">

**Author:** ![Tyzor](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/tyzor/32/1432_2.png) [@Tyzor](https://forum.babylonjs.com/u/Tyzor)\
**Post date:** [July 11, 2020, 12:57am UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358/6 "2020-07-11T00:57:37Z")

</div>

I’ve removed almost everything from the playground and the problem persists. (Kept the pointer move events so you can drag the camera around and see the line at certain angles).  
[https://www.babylonjs-playground.com/#339A8H#1](https://www.babylonjs-playground.com/#339A8H#1)

SpectreJS shows it’s in the draw call with just a basic plane.

 ![image](https://us1.discourse-cdn.com/flex024/uploads/babylonjs/original/2X/1/1d87ee5346fc1a27c56949d3b4731e3eb7c9e310.png)

It seems to be at the exact line where the two triangles of the plane form. Turning to wireframe rendering shows it. For now I’ve be able to get rid of the issue by adding more subdivisions to the ground plane.

---

<div class="post-metadata">

**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\
**Post date:** [July 13, 2020, 2:11pm UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358/8 "2020-07-13T14:11:08Z")

</div>

Do you repro if you change the camera.minZ value?

---

<div class="post-metadata">

**Author:** ![Tyzor](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/tyzor/32/1432_2.png) [@Tyzor](https://forum.babylonjs.com/u/Tyzor)\
**Post date:** [July 13, 2020, 2:56pm UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358/9 "2020-07-13T14:56:35Z")

</div>

Yes, I first thought it might be Z clipping or floating point issues with the near/far planes but no matter what I set the values to it would appear.

Only increasing the geometry on the plane seems to solve it. Or reducing the size of the plane will help as well. It seems to be appearing on the line where the two triangles of the plane join.

I’m using a maximized playground window on a 1920x1080 resolution desktop if that helps. It seems to also be affected by render size.

---

<div class="post-metadata">

**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\
**Post date:** [July 13, 2020, 3:02pm UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358/10 "2020-07-13T15:02:21Z")

</div>

Which browser are you using?

---

<div class="post-metadata">

**Author:** ![Tyzor](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/tyzor/32/1432_2.png) [@Tyzor](https://forum.babylonjs.com/u/Tyzor)\
**Post date:** [July 13, 2020, 6:31pm UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358/11 "2020-07-13T18:31:22Z")

</div>

Chrome but I just tested on Edge and it’s there as well. Maybe an issue specific to Nvidia drivers?

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [July 13, 2020, 6:50pm UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358/12 "2020-07-13T18:50:51Z")

</div>

It seems a driver issue indeed…

Have you tried to lower the dimensions of the plane?

---

<div class="post-metadata">

**Author:** ![Tyzor](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/tyzor/32/1432_2.png) [@Tyzor](https://forum.babylonjs.com/u/Tyzor)\
**Post date:** [July 13, 2020, 10:03pm UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358/13 "2020-07-13T22:03:13Z")

</div>

Yes lowering the dimensions of the plane or increasing the number of subdivisions makes the problem go away. I was trying to have the plane scale to put a grid on the whole scene so I guess having a few more vertices won’t hurt in the long run.

---

<div class="post-metadata">

**Author:** ![Evgeni\_Popov](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/evgeni_popov/32/4432_2.png) [@Evgeni\_Popov](https://forum.babylonjs.com/u/Evgeni_Popov)\
**Post date:** [July 13, 2020, 10:09pm UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358/14 "2020-07-13T22:09:00Z")

</div>

So it seems to be a precision problem in the rasterization performed by the GPU when rendering the triangles (or when doing clipping)…

---

<div class="post-metadata">

**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\
**Post date:** [July 13, 2020, 10:38pm UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358/15 "2020-07-13T22:38:01Z")

</div>

What GPU are you running on?

---

<div class="post-metadata">

**Author:** ![Tyzor](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/tyzor/32/1432_2.png) [@Tyzor](https://forum.babylonjs.com/u/Tyzor)\
**Post date:** [July 14, 2020, 12:38am UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358/16 "2020-07-14T00:38:10Z")

</div>

GeForce GTX 1070, latest drivers

I just tried on a Surface Pro and the issue isn’t there so it must be how the card is handling it.

---

<div class="post-metadata">

**Author:** ![Deltakosh](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/deltakosh/32/26635_2.png) [@Deltakosh](https://forum.babylonjs.com/u/Deltakosh)\
**Post date:** [July 14, 2020, 2:27pm UTC](https://forum.babylonjs.com/t/artifact-appearing-on-large-plane/12358/17 "2020-07-14T14:27:25Z")

</div>

Yes most definitely
