Javascript and canvas 3D model viewer [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.

---

This question appears to be off-topic because it lacks sufficient information to diagnose the problem. Describe your problem in more detail or include a minimal example in the question itself.

Closed 8 years ago.

Improve this question 开发者_开发知识库

I'm looking for a way to make a 3D model viewer for my site using Javascript and the canvas element. Something like on this page:

http://minecraftbr.com/novaskin/

You can see the model (the Minecraft guy) is shown and you can rotate and move him. What also needs to happen is a particular skin applied to the model. For example, each minecraft skins looks something like this:

http://i.stack.imgur.com/AiBnl.png

And it is then mapped onto the minecraft guy, to look like this:

http://minecraftbr.com/novaskin/#http://imgur.com/AiBnl.png

To be honest it seems like pretty easy pixel reading and then just applying the correct colour. What I'd really need help with is the 3D aspect of this, like the polygons for the head, body, arms, legs etc.

Is there a decent Javascript library for doing this kind of stuff? Something that can make it easy to use 3D polygons and stuff in the canvas element.

Help is appreciated, cheers.

---

I've made something like this and it's on my website, it's made with Canvas and CSS3 mainly. It will load in the username of a minecraft player and use their skin. I added basic ability to view on iPad/iPhone etc so you can turn the device and the model will move, as if you are moving the camera. The link is

mjstk.co.uk/dev/minechar/

or for loading in a skin of a custom user (you could upload/drag n drop new skins on if you wanted to add that)

mjstk.co.uk/dev/minechar/#minecraftusername

mjstk.co.uk/dev/minechar/#hugosslade (is mine)

If you are looking to do it completely in canvas though, I'd recommend three.js; While it does have support for WebGL, it also can utilise canvas (as well as other things)

Hope that was helpful