Pix2Gltfr

a web app to turn web images into .gltf files
by Ryan Guild

NodeJS Dependencies

• Parcel Bundler for zero config modern js & ts
• parcel-plugin-wasm.rs for rust and wasm-bindgen
• typescript for typechecking included in parcel
• react for dom interaction included in parcel

Rust Dependcies

• link

Design

• ingest Event<HTMLImageElement> and extract FileList to ReturnType<typeof URL.createURLObject>[]
• create <img/> tags to load dataurl objects
• from image extract natural dimensions and draw to <canvas/> tags
• ImageData objects from canvas are passed to the webassembly module created by rust and wasm-bindgen located in src/pix2gltfr
• image_to_gltf function returns a strinified gltf file constructed of the a cube buffer geometry translated and skined to the pixels of the image. 100% Transparent pixels are skipped.

Commands

• yarn start run a dev server
• yarn build build the github pages statics

Demo

• github pages