News : WebGL implementation repo and theory of 3D Gaussian Splatting ...

This is a WebGL implementation of a real-time renderer for 3D Gaussian Splatting for Real-Time Radiance Field Rendering, a recently developed technique for taking a set of pictures and generating a photorealistic navigable 3D scene out of it. As it is essentially an extension of rendering point clouds, rendering scenes generated with this technique can be done very efficiently on ordinary graphics hardware- unlike prior comparable techniques such as NeRFs.

You can see the examples from the theory paper can be found on example section from antimatter15 GitHub repo splat.

Web – graphtoy online tool.

You can find this tool on this website.

Sounds of Math Graphs by oynozan ...

---

Painting a Landscape using Mathematics by Inigo Quilez.

Inigo Quilez is a software engineer, technical artists, product manager and educator for 20 years, and have worked at places like Pixar and Oculus.

You can see the real-time rendering code on this webpage.

This is a video tutorial about how can build landscape using the mathematics:

Shadertoy: Modulo N and shader effects.

You can see easily how the math function modulo n affects the shaders.

These three colors are the result of the function modulo n.

You can see two vectors with two modulo ivec areas with these values: 6 and 3.

You can make changes and you see similar results.

A good math teacher can explain why this is happening.

Let me give you a hint: encryption and decryption theories.

Shadertoy: Build a cross intersection - 001.

Based on this tutorial created by Inigo Quilez I created a new cross intersection shader:

The shader is very simple.
I created a black box and then colored all the areas in the corner of this box with black.
I left a white area to see the cross.
You can see better if you change this line of source code:

...into this:

p_m = 1.0-p_m/(p_m+0.1);

or this:

p_m = 1.0-p_m*10.0/(p_m*10.0+0.1);

The shader can be ru and testd here:

Shadertoy: Build a geometric pattern - 001.

In this tutorial I will show you a simple geometric pattern created with the dot, sin and values taken by the mouse.
This example was built using shader toy online editor.
The source basket contains four lines of code.
The last line of source code is the output with data to display.
The other lines of source code are very simple to understand.
The values of a and b are values created by dividing fragCoord to iResolution of window ...
The fragCoord contains the pixel coordinates of the pixel where the shader is being applied.
The sin_dot will compute the sin of dot from a , b and mouse position.

Shadertoy: The sin math function - 002.

This is another shader example to draw a sine math function using a sine wave, see Wikipedia. I used shadertoy website and the mat sin function by time. The source code is commented for a better understanding of it.

// this size of line to paint each pixel from screen
const float size = 0.01;

void mainImage( out vec4 fragColor, in vec2 fragCoord )
{
    // Normalized pixel coordinates (from 0 to 1)
    vec2 uv = fragCoord/iResolution.xy;
    // resize uv 
    uv = uv  * 2.0;
    // translate normalized pixel coordinates uv from [0,1] to [-1, 1] with 
    uv = (uv - 1.0);

    // get uv.x aspect ratio
    uv.x *= iResolution.x / iResolution.y;
  
    // get simple sine 
    //float t = sin(uv.x);

    // get sine * 3 with same size uv will zoom the sine graphic
    // see also https://en.wikipedia.org/wiki/Sine_wave
    float t = sin(uv.x * 3.0);
    
 // select domain area of sine and drwa yellow color 
    // else put an blue color on rest
    if (uv.y >= t - size && uv.y <= t + size) {
        // draw sine
     fragColor = vec4(1.0,1.0,0.0,1.0);
    } else {
        // draw background
        fragColor = vec4(0.0,0.0,1.0,1.0);
    }
}

The result of this shader is this:

Another online math editor named mathcha.

If you like math whether you are a student, teacher, or parent, then this online editor is very suitable for you.
Take a look at the official youtube channel:

Shadertoy: The sin math function - 001.

Another example with shadertoy online tool.
The example come with all comments to understand how the sine function is show on shadertoy website.

GridMaths online tool to start with math.

This online tool named GridMaths for math can be used here.
The tool can be used for kids and parents or can use into advanced math.
I author comes with a series of articles about this online tool, see this link.
One good example about how can use this online tool can be found on youtube:

The art of mathematical functions.

If you want to see something special about math and art, then there is such a website.
Here are some funny examples of math functions in the following screenshot: