openvis-regl-livecoding.js

const regl = require('regl')({
  extensions: 'OES_element_index_uint'
})
const ndarray = require('ndarray')
const camera = require('regl-camera')(regl)
const normals = require('angle-normals')
const surfaceNets = require('surface-nets')
const vec3 = require('gl-vec3')

function processMesh (mesh) {
  return regl({
    frag: `
    precision highp float;
    varying vec3 color;
    void main () {
      gl_FragColor = vec4(color, 1);
    }
    `,

    vert: `
    precision highp float;
    varying vec3 color;
    attribute vec3 position, normal;
    uniform mat4 projection, view;
    uniform float t;
    void main () {
      color = 0.5 * (1. + normal);
      gl_Position = projection * view * vec4(position, 1);
    }
    `,

    attributes: {
      position: mesh.positions,
      normal: normals(mesh.cells, mesh.positions)
    },

    uniforms: {
      t: ({tick}) => Math.cos(0.1 * tick)
    },

    elements: mesh.cells
  })
}

require('resl')({
  manifest: {
    neurons: {
      type: 'binary',
      src: 'neurons.bin',
      parser: (data) => ndarray(new Uint8Array(data), [300, 230, 230]).transpose(1, 0)
    }
  },

  onDone({neurons}) {
    const mesh = surfaceNets(neurons, 200)
    mesh.positions.forEach((p) => {
      vec3.divide(p, p, neurons.shape)
    })

    const drawMesh = processMesh(mesh)

    regl.frame(() => {
      regl.clear({
        color: [0, 0, 0, 1],
        depth: 1
      })

      camera(() => {
        drawMesh()
      })
    })
  }
})