Modeling a service truck and a rooftop unit in three.js

Two models made for the acservice.systems site, now living here too. Both are pure code — no mesh files, no textures on disk. Every part is three.js geometry in real-world metres, so the same source can render on a page or drop into a scene at true scale.

AC Services / Unit TACLA-14402C

A 2020 Ford Ranger SuperCrew with a cab-high shell and ladder rack.

• Body from one profile. The side silhouette — hood slope, door line, bed, both wheel arches — is a single 2D shape extruded to body width and bevelled.
• Dimensions from the spec sheet. 5,354 mm overall, 3,220 mm wheelbase, axles placed from those numbers rather than eyeballed.
• Livery is drawn, not imported. Door, hood, bed and shell graphics are painted onto canvas textures at build time: logo, phone, unit number, service list.
• Parametric. Tire size and the ladder are inputs. The viewer exposes both.

RTU-10 · Packaged rooftop unit

A 10-ton gas/electric rooftop unit, 3.0 × 1.5 × 1.26 m: base rail with forklift slots and lifting lugs, access doors with latches, flue hood and gas inlet on the heat section, economizer hood on the return end, wrap-around condenser coil, two condenser fans with guards.

Parts that share a material are merged into one mesh each — 34 meshes for the whole unit — which keeps it cheap enough to drop into a larger scene.

Porting them here

The originals were single-file bundles with inline scripts. This site’s CSP allows scripts from its own origin only, so they couldn’t be dropped in as-is. Each model is now one import-free module — build(THREE, opts) returns the object — and two hosts use it:

• The viewer pages below render it with PBR materials, orbit controls and the model’s own parameters.
• The warehouse builds the same geometry with its retro Lambert materials and parks both pieces at full scale in this entry’s bay.

Same module, two renderers — so the model can’t drift between them.