sigmajs-circle-with-contour.js 2.46 KB
Newer Older
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23
// Based on sigma.js/src/rendering/webgl/programs/node.fast.ts

import { NodeDisplayData } from "sigma/types";
import { floatColor } from "sigma/utils";
import vertexShaderSource from "sigma/rendering/webgl/shaders/node.fast.vert.glsl";
import fragmentShaderSource from "sigma/rendering/webgl/shaders/node.fast.frag.glsl";
import { AbstractNodeProgram } from "sigma/rendering/webgl/programs/common/node";
import { RenderParams } from "sigma/rendering/webgl/programs/common/program";
import CircleNodeProgram from 'sigma/rendering/webgl/programs/node.fast';

const POINTS = 2;
const ATTRIBUTES = 4;

/*
export default class NodeContourFastProgram extends AbstractNodeProgram {
  //constructor(gl : WebGLRenderingContext) {
  constructor(gl) {
    super(gl, vertexShaderSource, fragmentShaderSource, POINTS, ATTRIBUTES);
    this.bind();
    }
*/

export default class NodeContourFastProgram extends CircleNodeProgram {
24 25 26 27 28 29 30 31 32
  constructor(gl) {
    super(gl, vertexShaderSource, fragmentShaderSource, POINTS, ATTRIBUTES);
    // NOTE super method above will set POINTS = 1 from CircleNodeProgram
    // We need to overwrite this
    // https://gitlab.iscpif.fr/gargantext/purescript-gargantext/issues/471
    this.points = POINTS;
    this.bind();
  }

33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54
  //process(data: NodeDisplayData, hidden: boolean, offset: number): void {
  process(data, hidden, offset) {
    const array = this.array;
    let i = offset * POINTS * ATTRIBUTES;

    if (hidden) {
      // contour
      array[i++] = 0;
      array[i++] = 0;
      array[i++] = 0;
      array[i++] = 0;

      // circle
      array[i++] = 0;
      array[i++] = 0;
      array[i++] = 0;
      array[i++] = 0;

      return;
    }

    const color = floatColor(data.color);
55 56
    //const black = floatColor('black');
    const gray = floatColor('#aaa')
57 58 59 60 61

    // contour
    array[i++] = data.x;
    array[i++] = data.y;
    array[i++] = data.size + 1;
62 63
    //array[i++] = black;
    array[i++] = gray;
64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87

    // circle
    array[i++] = data.x;
    array[i++] = data.y;
    array[i++] = data.size;
    array[i] = color;
}

  //render(params: RenderParams): void {
  render(params) {
    if (this.hasNothingToRender()) return;

    const gl = this.gl;

    const program = this.program;
    gl.useProgram(program);

    gl.uniform1f(this.ratioLocation, 1 / Math.sqrt(params.ratio));
    gl.uniform1f(this.scaleLocation, params.scalingRatio);
    gl.uniformMatrix3fv(this.matrixLocation, false, params.matrix);

    gl.drawArrays(gl.POINTS, 0, this.array.length / ATTRIBUTES);
  }
}