WebGL绘制圆形点

版权声明: https://blog.csdn.net/GISuuser/article/details/82754370

学习WebGL的朋友们,可能知道,绘制点的时候默认点是正方向的。

想要绘制圆形的点需要修改一下片元着色器,将正方向的四个角的绘制的时候省略一些绘制单元。

     #ifdef GL_ES
     #ifdef GL_FRAGMENT_PRECISION_HIGH
     precision highp float;
     #else
     precision mediump float;
     #endif
     #endif
     varying vec4 v_Color;
     void main() {
       float d = distance(gl_PointCoord, vec2(0.5, 0.5));
       if(d < 0.5) {
         gl_FragColor = v_Color;
       } else { discard; }
     }

其中的gl_PointCoord、vec2(0.5,0.5)都是基于当前点的内部坐标系,不是WebGL绘图坐标系。

顶点着色器

     attribute vec4 a_Position;
     attribute float a_PointSize;
     attribute vec4 a_Color;
     varying vec4 v_Color;
     
     void main() {
       gl_Position = a_Position;
       gl_PointSize = a_PointSize;
       v_Color = a_Color;
     }

结果 

猜你喜欢

转载自blog.csdn.net/GISuuser/article/details/82754370
今日推荐