javascriptthree.jsvrml

How to import VRML Files in three.js?


I'm trying to import a VRML file in three.js, but it doesn't work. Here is the VRML file:

#VRML V2.0 utf8

#Created by CINEMA 4D

DEF B1 Transform {
 translation 600 0 0.333333
 children [ 
 DEF _60_ Transform {
  translation -600 0 0
  children [ 
  ]
}
DEF Button Transform {
  translation 679.734143 0 0
  children [ 
    Shape {
      appearance DEF MAT_Metal_010 Appearance {
        material Material {
          ambientIntensity 0.2
          diffuseColor 0.815686 0 0.223529
          specularColor 0 0 0
          emissiveColor 0 0 0
          shininess 0.1
          transparency 0
        }
      }
      geometry DEF FACESET_Button IndexedFaceSet {
        ccw FALSE
        creaseAngle 1.396263
        coord Coordinate {
          point [ -100 -100 -100,-100 100 -100,-100 -100 100,-100 100 100,100 -100 100,
            100 100 100,100 -100 -100,100 100 -100
          ]
        }
        texCoord TextureCoordinate {
          point [ 0 1,1 0,
            0 0,0 0,1 1,0 1,1 1,
            0 0,1 0,1 0,0 1,1 1,
            1 0,0 0,1 1,0 1,0 0,
            1 0,0 1,1 1
          ]
        }
        coordIndex [ 0,1,3,2,-1,2,3,5,4,-1,4,5,7,6,-1,
          6,7,1,0,-1,1,7,5,3,-1,6,0,2,4,-1
        ]
        texCoordIndex [ 2,5,11,8,-1,7,10,14,12,-1,13,15,19,17,-1,
          16,18,4,1,-1,3,18,14,9,-1,16,0,6,12,-1
        ]
      }
    }
  ]
 }
]
}
DEF Timer TimeSensor {
startTime 0
stopTime 0
cycleInterval 14.4
loop TRUE
}

And here is my JavaScript code for the import:

var loader = new THREE.VRMLLoader();
loader.addEventListener( 'load', function ( event ) {
    scene.add(event.content);
    } );
loader.load( "models/MyVRML.wrl" );

The error message in the browser is:

TypeError: a is undefined three.js:1636.

I use the actual three.js (not minified)

Thanks for your help!


Solution

  • For now, your points should each be on their own line. I am willing to fix this, but currently facing a tight deadline. The workaround for now is to setup the coordinates like so:

    coord  Coordinate { #default NULL
        point [
            0.14    0   -0.14,
            5.54    0   -0.14,
            5.54    0   -8.86,
            0.14    0   -8.86,
        ]
    }