3

My app for volume ray casting in WebGL is almost done. But i have found a problem. I have to simulate 3D texture by 2D texture. It is not problem. I am creating a huge texture from small slices. Dimensions of huge texture are about 4096x4096px. Problem is, that in some examples (it depends on number of slices) there is creating sth. like on the image bellow (i filled huge texture to white to be the fragment more visible).

Fragment in image - cube should be only white without stripes

I know that num of stripes depends on num of rows in huge texture. I am generating this texture near to 4096x4096px (but not exactly). It could be 4080x4060 etc. I think, problem is, that Three.js load my texture to gpu, but dont scale it to 4096x4096..so i am reading in fragment shader black color on the border of texture, because webgl work only with squared textures (512x512, 1024x1024... etc.). It caused black stripes in rendered image.

Problem is, that my Three.js app doesnt work with WebGL Inspector..so i am not sure.

Any idea how to fix that?

Thanks.

Tomáš

EDIT:

Ok, i have found problem..and "solution"...but solution didnt work good. I have 2 datasets. One is OK, second still the same error.

2 variants of code (each one works fine for one dataset but not for second) :

First) 

 dx = mod(slice, numColsInTexture) / numColsInTexture;
 dy = 1.0 - (floor(slice / numColsInTexture) / numRowsInTexture);

Second)

dx = 1.0 -  (mod(slice, numColsInTexture) / numColsInTexture);
dy = (floor(slice / numColsInTexture) / numRowsInTexture);

I really don't know, why it doesnt work for both datasets...i tried to dump GPU (WebGL inspector). Both textures are loaded valid on GPU (same orientation, same dimensions). Everything is same.

Please help me....thanks.

Xrew
  • 173
  • 13
  • I know this is an old post but did you get it to work properly? Is your application available somewhere by any chance? I'd love to have a look. Best – Nicolas Jan 29 '15 at 13:10
  • Hi, you can see it there: https://www.youtube.com/watch?v=tVCJUmnxvIs – Xrew Jan 29 '15 at 16:16
  • Nice stuff! That looks really good! Is the code open source? And if so, are you fine with sharing it? – Nicolas Jan 29 '15 at 16:47

1 Answers1

0

Is your MIN and MAX filters of your texture set to NEAREST? And your WRAP[ST] set to CLAMP_TO_EDGE?

gaitat
  • 12,449
  • 4
  • 52
  • 76
  • Yes, they are : threeSrcTexture.magFilter = THREE.NearestFilter; threeSrcTexture.minFilter = THREE.NearestFilter; threeSrcTexture.wrapS = THREE.ClampToEdgeWrapping; threeSrcTexture.wrapT = THREE.ClampToEdgeWrapping; threeSrcTexture.needsUpdate = true; Error is still same... – Xrew Apr 03 '13 at 11:40
  • It will be perfect, if it scale my texture to ideal dimensions. I think it doesnt worry if the ratio of texture will be change. – Xrew Apr 03 '13 at 12:01
  • And what happens if you exactly use a 4096x4096 texture. – gaitat Apr 03 '13 at 12:14
  • According to http://www.khronos.org/webgl/wiki/WebGL_and_OpenGL_Differences you should not have a problem with non-power-of-2 texture. – gaitat Apr 03 '13 at 12:26
  • I have tried to load texture from file (exactly 4096x4096px) and it works perfect..texture that made problem have dimensions 4090x3780 (but many other textures make this artefact too.. – Xrew Apr 03 '13 at 12:27
  • So then the non-power-of-2 texture size is the problem. Maybe the above link can offer some insight. – gaitat Apr 03 '13 at 12:41