Blender export for THREE.js

Question

I have an issue with THREE.js export in Blender, namely: materials and textures don't get exported at all.

To show the issue, I've created a simple plane with one material and one texture.

This is entire file generated by JSON export:

{
"faces":[41,0,1,3,2,0,1,2,3,0,0,0,0],
"metadata":{
    "faces":1,
    "type":"Geometry",
    "uvs":1,
    "generator":"io_three",
    "normals":1,
    "version":3,
    "vertices":4
},
"uvs":[[0.0001,0.0001,0.9999,0.0001,0.9999,0.9999,0.0001,0.9999]],
"normals":[1,0,0],
"name":"PlaneGeometry",
"vertices":[-0,3e-06,16,1e-06,-4e-06,-16,-1e-06,32,16,0,32,-16]
}

In comparision, this one is for OBJ/MTL Wavefront format export (which confirms there indeed is a material and texture set for the model)

# Blender v2.76 (sub 0) OBJ File: 'wall_pipes.blend'
# www.blender.org
mtllib wall_pipes.mtl
o Plane
v -0.000000 0.000003 16.000002
v 0.000001 -0.000002 -15.999997
v -0.000001 32.000000 15.999997
v 0.000000 31.999996 -16.000002
vt 0.000100 0.000100
vt 0.999900 0.000100
vt 0.999900 0.999900
vt 0.000100 0.999900
vn 1.000000 0.000000 0.000000
usemtl Material.001
s off
f 1/1/1 2/2/1 4/3/1 3/4/1

...and its corresponding mtl file...

# Blender MTL File: 'wall_pipes.blend'
# Material Count: 1

newmtl Material.001
Ns 96.078431
Ka 1.000000 1.000000 1.000000
Kd 0.800000 0.800000 0.800000
Ks 0.021739 0.021739 0.021739
Ke 0.000000 0.000000 0.000000
Ni 1.000000
d 1.000000
illum 2
map_Kd E:\blender\models\library\textures\pk02_pipes01_C.png
map_Bump E:\\blender\\models\\library\\textures\\pk02_pipes01_C.png

I was thinking about using these generated obj/mtl files, but THREE.js r73 (I prefer its shadow format over the new one) seems to have some issues with them:

[.CommandBufferContext]RENDER WARNING: Render count or primcount is 0.

Anyway I'd like to use JSON format as it feels more natural to me and this is what other people suggest elsewhere. I apologise in case this lack-of-material issue is something really, really stupid :)

Here is the .blend file, maybe I am doing something wrong or have a checkbox unchecked somewhere...? https://github.com/Scharnvirk/wingmod/raw/blender_issue/models/wall_pipes.blend

Thanks in advance!

sambler · Accepted Answer · 2016-04-24 03:48:58Z

2

The three.js exporter has a lot of options, check that each material/UV option is on.

With the following options enabled

I get the following json

{
    "faces":[43,0,1,3,2,0,0,1,2,3,0,0,0,0],
    "metadata":{
        "version":3,
        "type":"Geometry",
        "uvs":1,
        "materials":1,
        "faces":1,
        "normals":1,
        "generator":"io_three",
        "vertices":4
    },
    "normals":[1,0,0],
    "name":"PlaneGeometry",
    "uvs":[[0.0001,0.0001,0.9999,0.0001,0.9999,0.9999,0.0001,0.9999]],
    "materials":[{
        "mapBumpAnisotropy":1,
        "mapDiffuseAnisotropy":1,
        "wireframe":false,
        "mapBumpWrap":["RepeatWrapping","RepeatWrapping"],
        "mapSpecularAnisotropy":1,
        "specularCoef":50,
        "visible":true,
        "mapSpecularRepeat":[1,1],
        "mapBumpScale":[2.05634,2.05634],
        "DbgColor":15658734,
        "mapSpecular":"pk02_pipes01_C.png",
        "mapDiffuse":"pk02_pipes01_C.png",
        "depthWrite":true,
        "mapBump":"pk02_pipes01_C.png",
        "mapDiffuseWrap":["RepeatWrapping","RepeatWrapping"],
        "shading":"phong",
        "depthTest":true,
        "DbgName":"Material.001",
        "opacity":1,
        "colorDiffuse":[0.8,0.8,0.8],
        "transparent":false,
        "mapSpecularWrap":["RepeatWrapping","RepeatWrapping"],
        "DbgIndex":0,
        "colorSpecular":[0.021739,0.021739,0.021739],
        "mapBumpRepeat":[1,1],
        "mapDiffuseRepeat":[1,1],
        "colorEmissive":[0,0,0],
        "blending":"NormalBlending"
    }],
    "vertices":[-0,3e-06,16,1e-06,-4e-06,-16,-1e-06,32,16,0,32,-16]
}

answered Apr 24, 2016 at 3:48

sambler

7,1611 gold badge20 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Scharnvirk Over a year ago

Thanks. I've eventually found where all these options are. I've found multiple other THREE tabs in Blender before, mostly in Properties editor (the one where you select Materials, Textures, UVs, World and so on), but didn't find the big one during the export itself. This is in fact my biggest problem when I am learning Blender: I am able to ask correct question and I see correct menu/option in a tutorial or guide, but finding it in the application is a whole different story. Is there some sort of.... option seeker or sth? Anyway big thanks, you've solved a problem I had for a few days! :D

Collectives™ on Stack Overflow

Blender export for THREE.js

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related