Javascript WebGL在线条上添加光晕效果

Javascript WebGL在线条上添加光晕效果,javascript,webgl,vivagraphjs,Javascript,Webgl,Vivagraphjs,我想在webgl中的图形线上添加发光效果 我使用库Vivagraph.js来显示节点和链接,而不是3JS 片段着色器: precision mediump float; varying vec4 color; void main(void) { gl_FragColor = color; } 顶点着色器: attribute vec2 a_vertexPos; attribute vec4 a_color; uniform vec2 u_screenSize; uniform mat4

我想在webgl中的图形线上添加发光效果

我使用库Vivagraph.js来显示节点和链接,而不是3JS

片段着色器:

precision mediump float;
varying vec4 color;
void main(void) {
    gl_FragColor = color;
}
顶点着色器:

attribute vec2 a_vertexPos;
attribute vec4 a_color;
uniform vec2 u_screenSize;
uniform mat4 u_transform;
varying vec4 color;
void main(void) {
    gl_Position = u_transform * vec4(a_vertexPos/u_screenSize, 0.0, 1.0);
    color = a_color.abgr;
}
渲染功能:

gl.useProgram(program);
gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
gl.bufferData(gl.ARRAY_BUFFER, storage, gl.DYNAMIC_DRAW);

if (sizeDirty) {
    sizeDirty = false;
    gl.uniformMatrix4fv(locations.transform, false, transform);
    gl.uniform2f(locations.screenSize, width, height);
}

gl.vertexAttribPointer(locations.vertexPos, 2, gl.FLOAT, false, 3 * Float32Array.BYTES_PER_ELEMENT, 0);
gl.vertexAttribPointer(locations.color, 4, gl.UNSIGNED_BYTE, true, 3 * Float32Array.BYTES_PER_ELEMENT, 2 * 4);
gl.drawArrays(gl.LINES, 0, linksCount * 2);
frontLinkId = linksCount - 1;
您是否有任何想法添加有关片段着色器上发光的信息?
Thx发光几乎总是一种后处理效果。通过将画布大小的纹理附加到帧缓冲区,可以将场景绘制到纹理中。然后,将该纹理渲染到画布上,并应用另一个着色器,该着色器会产生类似于发光的效果

换句话说,您不能通过修改片段着色器将光晕添加到上面的示例中。您需要另一组着色器