PointVolume3D.js

export default {
  // Configuration of the program
  props: {
    // 3D -> 2D projection settings
    camera: {
      type: 'orthographic',
      zoom: 2.25,
      position: [ 1, 1, 1 ]
    },
    // Vertex transformation before screen space transformation
    transform: {
      rotate: [
        ({ playhead }) => playhead * Math.PI * 2,
        0,
        0
      ]
    },
    // Shape/dimensions of generative structure
    shape: [ 8, 8, 8 ],
    // Can pass down any additional user properties
    // If you specify a function, it will be evaluated from current props
    radius: ({ width }) => width * 0.005
  },
  // Transform UVW to XYZ in world-space
  vertex ({ uv }) {
    // Map 0..1 to -1..1
    return uv.map(n => n * 2 - 1);
  },
  // Map the transformed screen-space XY position into renderable nodes
  render (data, { radius }) {
    return data.map(({ position }) => {
      return {
        type: 'circle',
        position,
        radius
      };
    });
  }
};