0

How do you texture a 3D model in WebGL? I understand all the basics of 3D in WebGL, I understand how to load textures and I understand how to load 3D models from external files, but I have no clue how to texture a model that is more complex than a basic cube.

I assume that the same principles apply in WebGL as in OpenGL or any other 3D rendering language, but I can't find any good information out there for WebGL, OpenGL, etc.
Any guidance/links/explanations would be greatly appreciated. Thank you.

gman
  • 100,619
  • 31
  • 269
  • 393
HartleySan
  • 7,404
  • 14
  • 66
  • 119

1 Answers1

2

So just FYI, skinning has a specific meaning in 3D graphics. It has to do with making a mesh follow a set of bones and bend between the bones. I edited your question once I saw your comment that you're really asking about texturing.

You want to know how to texture a complex model. The simple answer is you use a 3D modeling package like Maya or Blender for pretty much anything more complex than a simple cube or sphere. You then need to write (or find) tools to convert the data from the modeling package into something useful for your program.

A few links. Warning: For a complex model it's a complex process

https://blender.stackexchange.com/questions/1022/adding-uv-mapping-to-mesh

https://www.youtube.com/watch?v=f2-FfB9kRmE

http://www.chocofur.com/5-uv-mapping.html

http://sophiehoulden.com/tutorials/blender/unwrapTut.html

There are programmatic ways to apply textures like using various kinds of texture projections. See this answer for a few of them

Almost none of them are very useful except for a few basic things. For example spherical mapping is useful for texture mapping a sphere. But there's really no reason to use a separate spherical mapping calculation for a sphere as you can compute the sphere's texture coordinates as you compute the sphere vertices themselves.

Community
  • 1
  • 1
gman
  • 100,619
  • 31
  • 269
  • 393
  • Great answer, as always. Thanks a lot. There's a lot to digest here, and I don't completely understand it yet, but I can tell that it perfectly answers my question. Thanks again! – HartleySan Apr 29 '16 at 02:50
  • gman, thanks again for the answer. I have been learning Blender more and more recently. It's a lot to learn for a non-artist like myself. Anyway, are there any freely available 3D models of some complexity available that include the texture mapping so that I can get used to what the data looks like in the file and how to correctly import it into a WebGL scene? Thanks. – HartleySan May 06 '16 at 12:19
  • I have no idea. You might check http://opengameart.org. There's also http://mixamo.com but those are not free AFAIK and the license may or may not allow using on a public website. [A quick search brings up lots of sites](https://www.google.com/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#q=free+3d+models) – gman May 06 '16 at 12:28