add demos to README.md
This commit is contained in:
Abe Pazos
@@ -51,7 +51,12 @@ Two color spaces are added: `ColorHSLUVa` and `ColorHPLUVa`, they are an impleme
|
||||
## Demos
|
||||
### colormap/DemoSpectralZucconiColormap
|
||||
|
||||
This program demonstrates the `spectralZucconi6()` function, which
|
||||
takes a normalized value and returns a `ColorRGBa` using the
|
||||
accurate spectral colormap developed by Alan Zucconi.
|
||||
|
||||
It draws a varying number of vertical bands (between 16 and 48)
|
||||
filled with various hues.
|
||||
|
||||
|
||||
|
||||
@@ -59,7 +64,13 @@ Two color spaces are added: `ColorHSLUVa` and `ColorHPLUVa`, they are an impleme
|
||||
|
||||
### colormap/DemoSpectralZucconiColormapPhrase
|
||||
|
||||
This program demonstrates how to use the shader-based version of
|
||||
the `spectral_zucconi6()` function, which
|
||||
takes a normalized value and returns an `rgb` color using the
|
||||
accurate spectral colormap developed by Alan Zucconi.
|
||||
|
||||
It shades a full-window rectangle using its normalized `x` coordinate
|
||||
in a `ShadeStyle` to choose pixel colors.
|
||||
|
||||
|
||||
|
||||
@@ -67,7 +78,11 @@ Two color spaces are added: `ColorHSLUVa` and `ColorHPLUVa`, they are an impleme
|
||||
|
||||
### colormap/DemoSpectralZucconiColormapPlot
|
||||
|
||||
This demo uses the shader based `spectral_zucconi6()` function to fill the background,
|
||||
then visualizes the red, green and blue components of the colors used in the background
|
||||
as red, green and blue line strips.
|
||||
|
||||
The Vector2 points for the line strips are calculated only once when the program starts.
|
||||
|
||||
|
||||
|
||||
@@ -75,7 +90,12 @@ Two color spaces are added: `ColorHSLUVa` and `ColorHPLUVa`, they are an impleme
|
||||
|
||||
### colormap/DemoTurboColormap
|
||||
|
||||
This program demonstrates the `turboColormap()` function, which
|
||||
takes a normalized value and returns a `ColorRGBa` using the
|
||||
Turbo colormap developed by Google.
|
||||
|
||||
It draws a varying number of vertical bands (between 16 and 48)
|
||||
filled with various hues.
|
||||
|
||||
|
||||
|
||||
@@ -83,7 +103,13 @@ Two color spaces are added: `ColorHSLUVa` and `ColorHPLUVa`, they are an impleme
|
||||
|
||||
### colormap/DemoTurboColormapPhrase
|
||||
|
||||
This program demonstrates how to use the shader-based version of
|
||||
the `turbo_colormap()` function, which
|
||||
takes a normalized value and returns an `rgb` color using the
|
||||
Turbo colormap developed by Google.
|
||||
|
||||
It shades a full-window rectangle using its normalized `x` coordinate
|
||||
in a `ShadeStyle` to choose pixel colors.
|
||||
|
||||
|
||||
|
||||
@@ -91,7 +117,11 @@ Two color spaces are added: `ColorHSLUVa` and `ColorHPLUVa`, they are an impleme
|
||||
|
||||
### colormap/DemoTurboColormapPlot
|
||||
|
||||
This demo uses the shader based `turbo_colormap()` function to fill the background,
|
||||
then visualizes the red, green and blue components of the colors used in the background
|
||||
as red, green and blue line strips.
|
||||
|
||||
The Vector2 points for the line strips are calculated only once when the program starts.
|
||||
|
||||
|
||||
|
||||
@@ -171,7 +201,8 @@ to position the images dynamically based on their index within the grid.
|
||||
|
||||
### colorRange/DemoColorRange01
|
||||
|
||||
|
||||
Comparison of color lists generated by interpolating from
|
||||
`PINK` to `BLUE` in six different color spaces.
|
||||
|
||||
|
||||
|
||||
@@ -179,7 +210,13 @@ to position the images dynamically based on their index within the grid.
|
||||
|
||||
### colorRange/DemoColorRange02
|
||||
|
||||
Demonstrates how to create a `ColorSequence` containing three colors, one of them in the HSLUV color space.
|
||||
|
||||
Each color in the sequence is assigned a normalized position: in this program, one at the start (0.0),
|
||||
one in the middle (0.5) and one at the end (1.0).
|
||||
|
||||
The `ColorSpace.blend()` method is used to get a list with 18 interpolated `ColorRGBa` colors,
|
||||
then those colors are drawn as vertical rectangles covering the whole window.
|
||||
|
||||
|
||||
|
||||
@@ -187,7 +224,13 @@ to position the images dynamically based on their index within the grid.
|
||||
|
||||
### colorRange/DemoColorRange03
|
||||
|
||||
This program creates color interpolations from `ColorRGBa.BLUE` to
|
||||
`ColorRGBa.PINK` in 25 steps in multiple color spaces.
|
||||
|
||||
The window height is adjusted based on the number of interpolations to show.
|
||||
|
||||
The resulting gradients differ in saturation and brightness and apparently include more
|
||||
`BLUE` or more `PINK` depending on the chosen color space.
|
||||
|
||||
|
||||
|
||||
@@ -195,6 +238,17 @@ to position the images dynamically based on their index within the grid.
|
||||
|
||||
### colorRange/DemoColorRange04
|
||||
|
||||
A visualization of color interpolations inside a 3D RGB cube with an interactive 3D `Orbital` camera.
|
||||
|
||||
The hues of the source and target colors are animated over time.
|
||||
|
||||
The color interpolations are shown simultaneously in nine different color spaces, revealing how in
|
||||
each case they share common starting and ending points in 3D, but have unique paths going from
|
||||
start to end.
|
||||
|
||||
By rotating the cube 90 degrees towards the left and slightly zooming out, one can appreciate how
|
||||
one of the points moves along the edges of the cube, while the other moves on the edges of a
|
||||
smaller, invisible cube.
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -105,7 +105,15 @@ Demonstrate decal generation and rendering
|
||||
|
||||
### DemoAll
|
||||
|
||||
Demonstrates how to create various types of 3D meshes:
|
||||
box, sphere, dodecahedron, cylinder, plane, cap and resolve.
|
||||
|
||||
Two textures are used: one generative with gradients, and the second
|
||||
one is an image loaded from disk. The horizontal mouse position is used
|
||||
to select which of the two textures to use.
|
||||
|
||||
The meshes are positioned in space using a 2D mesh, and displayed
|
||||
rotating on the X and Y axes at different speeds.
|
||||
|
||||
|
||||
|
||||
@@ -113,6 +121,18 @@ Demonstrate decal generation and rendering
|
||||
|
||||
### DemoBox
|
||||
|
||||
Demonstrates how to create a 3D mesh box by specifying its width, height and depth.
|
||||
|
||||
The `box` is a `VertexBuffer` and contains texture coordinates which can be
|
||||
used to apply a texture to its faces.
|
||||
|
||||
After creating the box, the program creates a texture with a gradient.
|
||||
In it, the red component increases along the x-axis and the green component
|
||||
along the y-axis.
|
||||
|
||||
The scene is rendered with an interactive `Orbital` 3D camera.
|
||||
|
||||
A shade style is used to apply the texture to the box.
|
||||
|
||||
|
||||
|
||||
@@ -121,7 +141,15 @@ Demonstrate decal generation and rendering
|
||||
|
||||
### DemoComplex01
|
||||
|
||||
Demonstrates how to use `buildTriangleMesh` to construct composite 3D meshes.
|
||||
|
||||
A DSL allows specifying the color and transformations of each mesh, in this case,
|
||||
of a sphere and a box.
|
||||
|
||||
An interactive 3D Orbital camera is defined, specifying the location of its `eye` and
|
||||
`lookAt` properties.
|
||||
|
||||
A minimal shade style is used to simulate a uni-directional light pointing along the view Z axis.
|
||||
|
||||
|
||||
|
||||
@@ -129,7 +157,7 @@ Demonstrate decal generation and rendering
|
||||
|
||||
### DemoComplex02
|
||||
|
||||
|
||||
Demonstrates the creation of a 3D mesh composed of two hemispheres, a cylinder and 12 legs.
|
||||
|
||||
|
||||
|
||||
@@ -137,7 +165,14 @@ Demonstrate decal generation and rendering
|
||||
|
||||
### DemoComplex03
|
||||
|
||||
Demonstrates the creation of a 3D mesh composed of two hemispheres, a cylinder and 12 legs.
|
||||
Additionally, the body of the shape features 5 ridges on the sides
|
||||
of the cylinder.
|
||||
|
||||
The code reveals DSL keywords under `buildTriangleMesh`
|
||||
affecting transformation matrices, for instance `isolated`, `translate` and `rotate`,
|
||||
and mesh generating keywords like
|
||||
`hemisphere`, `taperedCylinder` and `cylinder`.
|
||||
|
||||
|
||||
|
||||
@@ -145,7 +180,9 @@ Demonstrate decal generation and rendering
|
||||
|
||||
### DemoComplex04
|
||||
|
||||
|
||||
Demonstrates the use of `buildTriangleMesh` to create
|
||||
a composite 3D mesh and introduces a new mesh generating keyword:
|
||||
`cap`.
|
||||
|
||||
|
||||
|
||||
@@ -153,6 +190,9 @@ Demonstrate decal generation and rendering
|
||||
|
||||
### DemoComplex05
|
||||
|
||||
Demonstrates how to create a 3D grid of extruded shapes
|
||||
(short cylinders), then applies three 3D twists to the
|
||||
composition to deform it.
|
||||
|
||||
|
||||
|
||||
@@ -161,8 +201,11 @@ Demonstrate decal generation and rendering
|
||||
|
||||
### DemoComplex06
|
||||
|
||||
Generates a grid of grids of boxes.
|
||||
Interactive orbital camera.
|
||||
Generates a grid of grids of 3D boxes using `buildTriangleMesh` and
|
||||
renders them using an interactive orbital camera.
|
||||
|
||||
The cubes ar colorized using a shade style that sets colors based
|
||||
on vertex positions in space, converting XYZ coordinates into RGB colors.
|
||||
|
||||
|
||||
|
||||
@@ -270,7 +313,13 @@ for a radial-symmetry effect.
|
||||
|
||||
### tangents/DemoTangents01
|
||||
|
||||
Tangent and bitangent vectors are used in shader programs for tangent space normal mapping / lighting
|
||||
and certain forms of displacement mapping.
|
||||
|
||||
This demo shows:
|
||||
- how to create a triangulated `MeshData`.
|
||||
- how to estimate the tangents of this MeshData.
|
||||
- How to use the tangent and bitangent attributes in GLSL code.
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -465,6 +465,31 @@ to round contours with linear segments.
|
||||
|
||||
[source code](src/jvmDemo/kotlin/hobbycurve/DemoHobbyCurve03.kt)
|
||||
|
||||
### hobbycurve/DemoHobbyCurve04
|
||||
|
||||
Demonstrates the use of the `tensions` argument when creating a Hobby curve.
|
||||
|
||||
The program starts by creating a random set of scattered points with enough separation between them.
|
||||
The points are sorted using `hilbertOrder` to minimize the travel distance when visiting all the points.
|
||||
Finally, we draw a set of 40 hobby translucent curves using those same points but with varying tensions.
|
||||
|
||||
|
||||
|
||||
[source code](src/jvmDemo/kotlin/hobbycurve/DemoHobbyCurve04.kt)
|
||||
|
||||
### hobbycurve/DemoHobbyCurve05
|
||||
|
||||
Demonstrates the creation of a 40 hobby curves with 10 points each.
|
||||
The control points in all hobby curves are almost identical, varying only
|
||||
due to a slight increase in one of the arguments of a simplex noise call.
|
||||
|
||||
The program shows that minor displacements in control points can have
|
||||
a large impact in the resulting curve.
|
||||
|
||||
|
||||
|
||||
[source code](src/jvmDemo/kotlin/hobbycurve/DemoHobbyCurve05.kt)
|
||||
|
||||
### hobbycurve/DemoHobbyCurve3D01
|
||||
|
||||
Demonstrates how to use the 3D implementation of the `hobbyCurve` method, to draw a smooth curve passing
|
||||
@@ -678,6 +703,22 @@ Demonstrate rectangle-rectangle intersection
|
||||
|
||||
[source code](src/jvmDemo/kotlin/primitives/DemoRectangleIntersection01.kt)
|
||||
|
||||
### primitives/DemoRectangleIrregularGrid02
|
||||
|
||||
Demonstrates how to use `Rectangle.irregularGrid()` to create a grid with varying column widths
|
||||
and row heights. The widths and heights are specified as a list of 13 `Double` values, each
|
||||
picked randomly between the values 1.0 and 4.0. This produces two types of columns and two
|
||||
types of rows only: wide ones and narrow ones.
|
||||
|
||||
The program also demonstrates how to query a `row()` and a `column()` from a `RectangleGrid` instance,
|
||||
both of which return a `List<Rectangle>`. Both `Rectangle` lists are rendered with translucent
|
||||
colors, which makes the intersection of the column and the row slightly brighter.
|
||||
|
||||
|
||||
|
||||
|
||||
[source code](src/jvmDemo/kotlin/primitives/DemoRectangleIrregularGrid02.kt)
|
||||
|
||||
### primitives/DemoRectangleIrregularGrid
|
||||
|
||||
|
||||
@@ -749,6 +790,21 @@ This serves as a demonstration of positioning and rendering shapes in a structur
|
||||
|
||||
[source code](src/jvmDemo/kotlin/primitives/DemoTear01.kt)
|
||||
|
||||
### primitives/DemoTear02
|
||||
|
||||
Demonstrates the use of `Tear()` to create drop-like shapes out of a Vector2 point and a Circle.
|
||||
|
||||
The tear locations are calculated using the `Rectangle.scatter()` function. Locations near the
|
||||
center of the window are filtered out.
|
||||
|
||||
The radii of each tear is randomly chosen between three values. The orientation of each tear
|
||||
is calculated by getting the normalized difference between the tear and the center of the window,
|
||||
making them look as being emitted at the center of the window.
|
||||
|
||||
|
||||
|
||||
[source code](src/jvmDemo/kotlin/primitives/DemoTear02.kt)
|
||||
|
||||
### rectify/DemoRectifiedContour01
|
||||
|
||||
|
||||
|
||||
@@ -37,6 +37,11 @@ Note that drawing inside the `repeat` action has no effect. Have a look at the d
|
||||
## Demos
|
||||
### DemoRepeat01
|
||||
|
||||
A simple demonstration on using the `repeat` method to execute a function
|
||||
at regular intervals.
|
||||
|
||||
Note that drawing inside the repeat action has no effect.
|
||||
See DemoRepeat02.kt to learn how to trigger drawing.
|
||||
|
||||
|
||||
|
||||
@@ -45,14 +50,29 @@ Note that drawing inside the `repeat` action has no effect. Have a look at the d
|
||||
|
||||
### DemoRepeat02
|
||||
|
||||
This demonstrates how to combine `repeat {}` with a postponed event to trigger drawing
|
||||
This demonstrates how to combine `repeat {}` with a postponed event to trigger drawing.
|
||||
|
||||
|
||||
|
||||
[source code](src/demo/kotlin/DemoRepeat02.kt)
|
||||
|
||||
### DemoRepeat03
|
||||
|
||||
Shows how a `repeat` block can update a variable used
|
||||
for rendering. In this demo, the `opacity` variable is
|
||||
reduced on every animation frame, and increased to 1.0
|
||||
every 2 seconds, creating a pulsating animation effect.
|
||||
|
||||
|
||||
|
||||
[source code](src/demo/kotlin/DemoRepeat03.kt)
|
||||
|
||||
### DemoTimeOut01
|
||||
|
||||
Demonstrates the `timeOut` function.
|
||||
|
||||
It is similar to the `repeat` function,
|
||||
but it runs only once after the specified delay in seconds.
|
||||
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user