Source: js/axes.js

function buildAxes(length) {
  /** @function buildAxes
   * @desc Returns axes to be added to the scene.
   * @author [Soledad Penades]{@link https://soledadpenades.com/articles/three-js-tutorials/drawing-the-coordinate-axes/}
   * @param {number} length The axis radius
   * @return The axis geometry ready to be added to the scene
   */
  var axes = new THREE.Object3D();
  var linewidth = 2;

  function buildAxis(src, dst, colorHex, dashed) {
    var geom = new THREE.Geometry(),
      mat;

    if (dashed) {
      mat = new THREE.LineDashedMaterial({
        linewidth: linewidth,
        color: colorHex,
        dashSize: 3,
        gapSize: 3
      });
    } else {
      mat = new THREE.LineBasicMaterial({
        linewidth: linewidth,
        color: colorHex
      });
    }

    geom.vertices.push(src.clone());
    geom.vertices.push(dst.clone());
    geom.computeLineDistances(); // This one is SUPER important, otherwise dashed lines will appear as simple plain lines

    var axis = new THREE.Line(geom, mat, THREE.LineSegments);

    return axis;
  }

  axes.add(buildAxis(new THREE.Vector3(0, 0, 0), new THREE.Vector3(length, 0, 0), 0xFF0000, false)); // +X
  axes.add(buildAxis(new THREE.Vector3(0, 0, 0), new THREE.Vector3(-length, 0, 0), 0xFF0000, true)); // -X
  axes.add(buildAxis(new THREE.Vector3(0, 0, 0), new THREE.Vector3(0, length, 0), 0x00FF00, false)); // +Y
  axes.add(buildAxis(new THREE.Vector3(0, 0, 0), new THREE.Vector3(0, -length, 0), 0x00FF00, true)); // -Y
  axes.add(buildAxis(new THREE.Vector3(0, 0, 0), new THREE.Vector3(0, 0, length), 0x0000FF, false)); // +Z
  axes.add(buildAxis(new THREE.Vector3(0, 0, 0), new THREE.Vector3(0, 0, -length), 0x0000FF, true)); // -Z

  return axes;
}