Hacker News Reader

Hacker News

Comment by ninjazee124 | Hacker News Reader

Parent Full thread

ninjazee124

Anyone know how they built their 3D graphic page?

http://images.businessweek.com/graphics/airbus-a350-3d-graph...

How did they go from the Trimble/Sketchup A350 model to showing the model in the browser in "3D"?

View on HN

No idea, but it put this in the Javascript Console...

   Recommended listening: 
    http://youtu.be/AjzcdvF3gDc?t=3m48s 
    http://youtu.be/mGF_0AcHaGs 
    http://youtu.be/kn6-c223DUU 
    http://youtu.be/eF-4Cr9Iy_8

edit: further investigation looks like they're using http://threejs.org loading a COLLADA-format file (that can even be QuickLooked on my Mac somehow) http://images.businessweek.com/graphics/airbus-a350-3d-graph...

I love easter eggs like this. I'm going to start checking the JS console for every website from now on..

OS X has had OpenCOLLADA built into QuickLook (as well as Preview) for a few years now.

That said, it can still be fussy with many scenes.

Here is the script of the 3D scene (not minified) http://images.businessweek.com/graphics/airbus-a350-3d-graph...

Hi, I made this. (The page, not the model.) Y'all basically figured it out. Three.js atop WebGL, and here's the Collada loader: https://github.com/mrdoob/three.js/wiki/Using-SketchUp-Model...

A small thing, but hugely gratifying that kalleboo found the recommended listening.

To answer my own question, looks like they are using three.js as described here to load the Collada/DAE file.

http://tech.vg.no/2013/07/08/webgl-dae-model-viewer/

Reply on news.ycombinator.com