Loading VRML into three.js, Revisited

In an earlier post, I did an experiment where I tried to load some of my antique VRML files into three.js, so that they could be experienced in a browser without the long-defunct Cosmo Player. The experiment concluded that loading directly is not going to be an effective way to resurrect those virtual worlds.

What I’m trying now is a good deal more Goldbergian, but from what I’ve seen so far, it just might work. First, we import the antique VRML file into Blender – then, we export the Blender workspace containing the virtual world into a JSON file – which, from what I’ve read, could be loaded into three.js. Sounds reasonable – but that’s a goodly number of steps that all have to work, for this plan to pan out.

The first thing that has to work, is that Blender would have to be able to import these files without butchering them, or choking on them, like the three.js loader did.

Blender likes my antique VRML files.

In Blender, under File, under Import, is X3D Extensible 3D. This supports not only .x3d files, but .wrl files as well! Not all .wrl files, though – it makes no claims to support VRML97 files. Thankfully, the virtual worlds I’m interested in resurrecting are mostly contained in VRML2.0 files, and, lucky for me, these are the type that work with Blender’s import function.

And lo and behold – it does work! I had to adjust the position or the rotation of a few things in the imported model, as they were upside-down or what not. But nothing at all like the rain of errors and nothingness I wound up with, trying to squoosh these files into three.js directly.

So, here it is, here’s what’s in that file I’ve been trying to open, here’s a peek into a virtual world I haven’t seen in over a decade, and really, it looks a lot like I remember it:


Haha! One step along the way. So far, so good. Nice to see you again, old house.

So, what I need to do next is export this as a JSON file – which, I understand will involve souping up my installation of Blender. Then, I’ll need to get that JSON file imported by three.js. And, before I do that, I gotta get better with blender – this thing I’m looking at is a collection of many many many little meshes – they are not grouped. So I can’t control them as a group. And given that this .wrl file is just one model for a virtual world composed of many models – I’m gonna be able to need to group ’em better, to be able to mix and match them properly. Back to the woodshed!



Tweet about this on TwitterShare on Google+Share on LinkedInShare on FacebookEmail this to someone

Author: Pete

Editor-in-Chief, Lead Software Developer and Artistic Director @ 3dspace.com

One thought on “Loading VRML into three.js, Revisited”

Comments are closed.