Ladies, Gents, Bikers,
I’ve created a fully rotatable, zoomable and pannable model of a Ducati Testastretta Evoluzione 4-valve cylinder head in motion, including all moving parts (camshafts, rockers, shafts, valves, shims, auxiliary springs). You can include or exclude any of the above in the animation, modify animation speed, start or stall the animation.
Pretty well optimised (low draw-call-count) for best performance even on mobile devices).
Following an exchange via PM I got encouraged to publish more details about this project, so here goes:
I’m aware that I’m not advancing the understanding or application of three.js as such. Obviously, I’m particularly weak on the materials and lighting side of three.js.
The foremost challenge for me was on the geometry side:
- finding and disassembling a genuine Ducati Testastretta cylinder head and acquiring the geometry information of all parts involved.
- modelling most of the parts in Cinema4D
- hard-coding the purely rotationally-symmetrical parts as THREE.LatheBufferGeometry/ies
- hard-coding the springs as two(!) overlapping THREE.TubeBufferGeometry/ies each, to fake the spring bending part of the animation
- exporting the geometry from Cinema4D as VRML
- importing those *.wrl files into my viewer.
For the optimisation, I hard-coded geometries where possible, merged BufferGeometries where applicable, combined the partners in Boolean operations in Cinema4D during VRML export into one object each. This brings the count of draw-calls per frame down to around 80. All in all, this yields approx… 35 fps on my iPhone 5S while on my iMac of 2014 and my MacBookAir of 2017 the full 60 fps are maintained, at least at the initial zoom level. I did notice however, that iMac and MacBook Air both seem to be fill-rate-limited. Because after zooming in (more pixels on screen covered), the frame rate drops and the fans go off.
As far as the animation goes, within my Cinema4D model I collected a multi-column, 72 row array of values for the rocking angles of the closing and opening rockers, at 5° intervals of the camshafts, as well as the (local) longitudinal travel values of the valves. For any intermediate camshaft angles, I’m interpolating.
I’ve described the “how I did it” on my blog, which is - alas - German only, but has many photographs and sketches, so you might enjoy it nevertheless: