I've taking a WebGL2 tutorial on how to make UV Spheres but noticed a one pixel size line running from the north to south poles of my uv sphere:

(you'll have to click on the images to get a better look)

Before posting this question, I tried exporting a UV Sphere primitive made on Blender, unwrapped it using Blender's sphere unwrapping function, and still I got the same line. I wanted to discard the possibility of this line happening because of my uv sphere implementation, but get the same situation with a uv sphere generated with blender.

I'm also not lighting the scene, just using the diffuse texture map. I also drew a straight line from beginning to end on the diffuse map in order to make sure the uvs are lined up, and everything is okay..but at some point, you'll see that minor 1 pixel separation as mentioned above.  

Would anybody have any clue of what might be happening? I can't seem to figure out why this is occurring.

Some extra info:

Thought I'd mention some of my texture settings just in case it helps:

  mipmapping: true,
  wrap:       "clamp",
  minfilter:  "linearmipmap",
  magfilter:  "linear"

What does the texture look like?  Is there any margin or padding on the texture?  Texture maps are usually dilated as much as possible (though in reality a few pixels is all that's needed, but the more dilation the better for lower resolution mip map versions) to prevent these types of seams.

If the texture doesn't turn out to be the problem, perhaps you could post your sphere mesh code or link to the tutorial you're working from (it might be useful to see how the sphere mesh is built).

19 minutes ago, gaxio said:

What does the texture look like?  Is there any margin or padding on the texture?  Texture maps are usually dilated as much as possible (though in reality a few pixels is all that's needed, but the more dilation the better for lower resolution mip map versions) to prevent these types of seams.

Hey what's up Gaxio, no padding as far as I see, in fact this is what it looks like:

15 minutes ago, Zakwayda said:

If the texture doesn't turn out to be the problem, perhaps you could post your sphere mesh code or link to the tutorial you're working from (it might be useful to see how the sphere mesh is built).

Good point, but I actually tested exporting a uv sphere from Blender and I get the same issue. Here's the UV Sphere code, which  I got from the following tutorial.

I'm no expert on texture mapping but I might take a stab at it.  Perhaps it's an issue with your U coordinates.  You go all the way around and then on the last section you have to jump back to zero which means your interpolation will be quit different there. Perhaps you could try going from 0 to 1 for the western hemisphere and then go from 1 back down to 0 for the eastern.  That way interpolation will be the same everywhere just kind of reversed.  If I'm way off just ignore me

are you using opengl? CLAMP mode is deprecated!... use CLAMP_TO_EDGE instead

PS: I haven't checked in webgl2, but probably it is the same

1 hour ago, Jihodg said:

are you using opengl? CLAMP mode is deprecated!... use CLAMP_TO_EDGE instead

PS: I haven't checked in webgl2, but probably it is the same

WebGL2 is what I'm using., actually I'm also using CLAMP_TO_EDGE, sorry I should have been more specific. The api I wrote just needs the word "clamp". 

if (value === "clamp") wrap = gl.CLAMP_TO_EDGE;

12 hours ago, Gnollrunner said:

I'm no expert on texture mapping but I might take a stab at it.  Perhaps it's an issue with your U coordinates.  You go all the way around and then on the last section you have to jump back to zero which means your interpolation will be quit different there. Perhaps you could try going from 0 to 1 for the western hemisphere and then go from 1 back down to 0 for the eastern.  That way interpolation will be the same everywhere just kind of reversed.  If I'm way off just ignore me

Gnoll, actually I'm going to try that, thanks for your suggestion!

If you haven't solved this yet, and if your project is relatively small and self-contained (e.g. an HTML file, some JS files, and the texture), maybe you could post the project here for people to try out. Someone might be able to spot the problem that way. (I realize if you're using third-party frameworks that might not be straightforward.)

I know you said you got the same results with Blender, which does suggest it's not a mesh-building problem. And, the artifacts in your screenshots don't particularly look like what you'd get from mesh errors. But for what it's worth, I do see some things in the mesh-building code that look a little suspicious (mostly having to do with numerical error and vertex welding).

have you disabled mipmapping to check that there is nothing wrong with your texture mip maps or settings?

The UV's should not go all the way to the edge.