Three.js: Rendering a texture on ShapeGeometry

2
votes

I have a problem with rendering a texture on a ShapeGeometry. First a little background on the problem.

I am attempting to render a SVG path with a texture using Three.js. I already managed to render the path properly. The problem is with the texture: http://s14.postimage.org/9xifetrf5/scene.png

The Cube renders the texture properly, where the Shape in the corner appears to render without the texture

After a very big zoom the texture can be noticed, but it's scaled down: http://s9.postimage.org/9fof5f3sv/close_up.png

Both objects are similar in size and both use the same material. I suspect that this is a problem with the UV mapping, but I am not sure how to calculate the UV map, any information on the subject would be great.

The code for loading the texture looks like this:

texture = t.ImageUtils.loadTexture "/images/#{pe.element.element_id}/top.png"
texture.wrapS = texture.wrapT = THREE.RepeatWrapping
texture.repeat.set(1, 1)
mat = new t.MeshBasicMaterial
  map: texture
  overdraw: true
  side: t.DoubleSide

I'm using Revision 54 of Three.js

1
three.js
You haven't described what it is supposed to look like, and you haven't provided code to describe how the mesh was created. Can you provide a live example? – WestLangley
It's supposed to look like the cube, the texture shouldn't be scaled and tiled like that. The code for generating the mesh is as follows: gist. As for the live example, I will try to provide one, but this code is a part of a much larger system and it's hard to take out this particular part. – Szymon Szeliga
"the texture shouldn't be scaled and tiled like that." You still haven't described what it IS supposed to look like. Is the texture in the corner supposed to cover the entire plane? – WestLangley

1 Answers

-1
votes

https://github.com/mrdoob/three.js/blob/master/src/extras/geometries/CubeGeometry.js#L126

Check out the example for Cube Geometry, if you answer the questions posed above it would be easier but I suspect that you need to set the UV (at line 94 in example).