Quatrefoil
Render Three.js with Respo style code(experimental).
Demo http://repo.quamolit.org/quatrefoil.calcit/
Shortcuts for viewport movememnt
Keyword shortcuts for viewport moving:
-
wmove forward -
smove backward -
amove left -
dmove left - "Up" move up
- "Down" move down
- "Shift Up" rotate to view up
- "Shift Down" rotate to view down
- "Left" rotate to view left
- "Right" rotate to view right
Schema
-
Material, currently:line-basic,:line-dashed,:mesh-basic,:mesh-lambert,:mesh-standard.
{}
:kind :mesh-standard
:opacity 0.9
:transparent true
:roughness 0.5
:metalness 0.9
:color 0x9050c0-
group, takes children elements:
group $ {}
:position $ [] 0 0 0
:rotation $ [] 0 0 0
:scale $ [] 1 1 1-
scene, which refers to a global scene element:
scene ({})box
box $ {}
:width 10
:height 10
:depth 10
:material Material
:position $ [] 0 0 0
:rotation $ [] 0 0 0
:scale $ [] 1 1 1
:material Materialsphere
sphere $ {}
:radius 10
:width-segments 10
:height-segments
:position $ [] 0 0 0
:rotation $ [] 0 0 0
:scale $ [] 1 1 1
:material Materialpoint-light
point-light $ {}
:color $ 0xaaaaff
:intensity $ 1
:distance 100
:position $ [] 0 0 0ambient-light
ambient-light $ {}
:color $ 0xaaaaff
:intensity 1rect-area-light
rect-area-light $ {}
:color $ 0xaaaaff
:intensity 1
:width 100
:height 100
:look-at $ [] 100 100 100
:position $ [] 0 0 0
:rotation $ [] 0 0 0
:scale $ [] 1 1 1perspective-camera
perspective-camera $ {}
:fov 40
:aspect $ / js/window.innerWidth js/window.innerHeight
:near 10
:far 100text
text $ {}
:text |Demo
:position $ [] 0 0 0
:rotation $ [] 0 0 0
:scale $ [] 1 1 1
:material Materialline
line $ {}
:lines $ [][]
10 20 10
100 140 0
:position $ [] 0 0 0
:rotation $ [] 0 0 0
:scale $ [] 1 1 1
:material Materialspline
spline $ {}
:points $ [][]
10 20 10
100 140 0
:position $ [] 0 0 0
:rotation $ [] 0 0 0
:scale $ [] 1 1 1
:material Materialtorus
torus $ {}
:r1 10
:r2 2
:s1 20
:s2 40
:arc $ * 2 &PI
:position $ [] 0 0 0
:rotation $ [] 0 0 0
:scale $ [] 1 1 1
:material Materialtube
tube $ {}
:points-fn $ fn (radio factor)
[] (* factor radio) 0 0
:factor 1
:radius 0.8
:tubular-segments 400
:radial-segments 20
:position $ [] 0 0 0
:rotation $ [] 0 0 0
:scale $ [] 1 1 1
:material Materialshape
shape $ {}
:path $ [][]
:move-to 0 0
:line-to 10 10
:line-to 10 5
:line-to 0 0
:position $ [] 0 0 0
:rotation $ [] 0 0 0
:scale $ [] 1 1 1
:material Materialpolyhedron
polyhedron $ {}
:vertices $ [][] (8 4 -2)
4 9 -3
-5 -2 -4
4 2 8
:indices $ [][] (0 1 2)
0 1 3
0 2 3
1 2 3
:radius 10
:detail 0
:position $ [] 20 10 10
:material Materialplane-reflector
plane-reflector $ {}
:width 40
:height 40
:color 0xffaaaa
:position $ [] 0 0 0
:rotation $ [] 0 0 0-
parametricfor parametric geometry
parametric $ {}
:func $ fn (u v)
[] 0 0 0
:slices 10
:stacks 10-
buffer-objectbased onBufferGeometry
and flat-values is a macro for turning lists into a flat one.
buffer-object $ {}
:vertices $ flat-values
0 0 0
10 0 0
5 0 8
5 8 0
:indices $ flat-values
0 1 2
0 2 3
1 2 3Develop
Relies on https://github.com/calcit-lang/calcit_runner.rs .
yarn
cr --emit-js -1
cp assets/* js/out/
yarn viteLicense
MIT
