Blender to Three.js (.JSON) and OBJ to .JS texture mapping issues

1
votes

I'm stumped. I've looked at all related threads I could find, none quite describe my issue.

I'm trying to get either a .JSON or .JS version of a model to export and texture map the same as an .OBJ version when rendered via WebGL. Below is an image illustrative of what's happening:

WebGL rendered MODEL EXAMPLES

Setup: Win7, Blender 2.77, Three.js (downloaded 5/22/16), Three.js (.json) Blender Exporter, Python OBJ > .JS converter script (convert_obj_three.py)

python convert_obj_three.py -i xxx.obj -o xxx.js

Steps:

  • WoW model exported from WoW ModelViewer as .OBJ
  • WoW model imported to Blender
  • Blender Edit mode to "Remove Doubles"
  • Blender Export to .OBJ
  • Three.js THREE.OBJLoader() script to test on Web

Results in "GOOD" example (left case in image)

  • Blender Export to .JSON (trying every config imaginable and then some)
  • Three.js THREE.JSONLoader() script to test on Web

Results in "BAD" example (middle case in image)

  • Blender Export to .OBJ
  • CMD line Python script to do conversion from OBJ to .JS
  • Three.js THREE.JSONLoader() script to test on Web

Results in "WORSE" example (middle case in image). For some reason in this last instance not just the Hair texture, but portions of skin of the model's face get wonky as well.

You'll likely notice the light rendering varies a bit in each case as well.

I look at the .JSON and .JS files and have no idea how to manually edit if that's ultimately what's needed.

Perhaps certain models simply won't texture properly?

1
javascriptthree.jstexturesblender
What is the problem exactly? The pic on left looks good to me? – WacławJasper
If you believe it is a three.js bug, file a bug report on the three.js site and provide a link to a zip file of all your project files, including a simple demo. – WestLangley
HI, the problem is I need to get it working properly in .JSON or .JS in order to be able to animate using the Three.js framework. I solved the lighting problem, as well as the strange warbling on the image furthest to the right. It was caused by starting with an .OBJ that had already been saved once from Blender. The only remaining issue is my inability to figure out the coordinate mapping being used for the hair. – aoedipus

1 Answers

0
votes

Your UV's for the head of your model are outside the range [ 0, 1 ].

When you load your JSON model, set

texture.wrapS = texture.wrapT = THREE.RepeatWrapping;

three.js r.77