Experiments with Zdog.js

Zdog.jsを使った実験

This page contains early experiments that I did with Zdog.js. Zdog is a 3D JavaScript engine for Canvas and SVG by Dave Desandro. A documentation can be found here Zdog.js.

Zdog isn't a real 3D engine. It renders geometrical descritions of primitive shapes - like 2D projections - to canvas and svg. It isn't possible to apply textures, lighting and shading to the primitive shapes. Also well known features like Boolean operators or extrusion isn't possible with this library. However, compared to complex 3D engines like Three,js, Zdog has some advantages for web dev. Zdog engine is lightweight (less than 30kB). It isn't dependent on polygons (and the accompanied disadvantages) and renders always sharp vector graphics (svg) on the screen like Adobe Illustrator or Affinity Designer. And the most important part is, Zdog is user friendly because modeling is done with a straight-forward declarative API supported by a good documentation. Another nice side effect is the dynamic behaviour of the models. They are interactive, just drag and rotate with the mouse.

Metal Fear

メタル フィアー

I started to prectice doing more structured code and doing more models with the outlines technique.

Melons

メロン

Experimenting with superimposed motions.

Rubber Hose

ラバーホース

This one was tricky. 1st how to animate spline and 2nd how to realize the outlines? Finally I discovered how to do so.

Corn Poppy

コーンポピー

Just a lonely corn poppy flower. The shaft was made with a spline.