teoyoung

1. Threejs : points cloude part I :
https://codepen.io/teoyoung/pen/XGxqzq

teoyoung

        let radius = 200;
        let separation = 10;

        for ( var s = 0; s <= 180; s+=separation ) {

            var radianS = s*Math.PI / 180;
            var pZ = radius * Math.cos(radianS);
          
            for ( var t = 0; t < 360; t+=separation ) {

teoyoung

  vec3 anim( float t, vec3 s, vec3 e){
      // Добавил небольшую паузу перед стартом
      float X = (1.0-t)*rand( vec2(s.y,e.z )) + t * 1.0;
      t = t*X;
      //
      float x = pow((1.0-t), 2.) * s.x + 2. * (1. - t) * t * rand( vec2(s.y,e.z )) + pow( t, 2.) * e.x;
      float y = pow((1.0-t), 2.) * s.y + 2. * (1. - t) * t * rand( vec2(s.x,e.z )) + pow( t, 2.) * e.y;
      float z = pow((1.0-t), 2.) * s.z + 2. * (1. - t) * t * rand( vec2(s.y,e.x )) + pow( t, 2.) * e.z;
      return vec3(x, y, z);
  }

teoyoung

========== HTML ===============

<script src="https://threejs.org/build/three.js"></script>
<script src="https://threejs.org/examples/js/libs/stats.min.js"></script>
<div id="host"></div>

<script>
  var WIDTH = window.innerWidth,
    HEIGHT = window.innerHeight,
    FOV = 35,

teoyoung

WebGl courses + tutorials
---------------------------------------
1. Great GLSL course
https://thebookofshaders.com/
https://thebookofshaders.com/?lan=ru (russian language)

2. WebGl basics
https://webglfundamentals.org
https://webglfundamentals.org/webgl/lessons/ru (russian language)

teoyoung

Hello world

Hello