Axes helper with different colors

Is it possible to switch the axesHelper colors?

Many people uses the RGB having B as vertical.

I don’t know which is the standard: GREEN or BLUE

To switch the color I have found this, but it doesn’t work:

    /* HELPERS */
  var axesHelper = new THREE.AxesHelper(5);
  var colorsAxes = colorsAxes.geometry.attributes.color;

 colorsAxe.setXYZ( 0, 1, 0, 0 ); // index, R, G, B
  colorsAxe.setXYZ( 1, 1, 0, 0 ); // red
  colorsAxe.setXYZ( 2, 0, 1, 0 );
  colorsAxe.setXYZ( 3, 0, 0, 1 ); // green -> blue
  colorsAxe.setXYZ( 4, 0, 0, 1 );
  colorsAxe.setXYZ( 5, 0, 1, 0 ); // blue -> green
  this.scene.add(axesHelper);

Try it like so: https://jsfiddle.net/x9s2r4t1/1/

Notice that each axis is represented by a line segment which has a start and end point. Hence, two subsequent color values belong to a single axis. The color attributes needs to be configured like so if you want to switch green and blue:

colors.setXYZ(0, 1, 0, 0);
colors.setXYZ(1, 1, 0, 0);
colors.setXYZ(2, 0, 0, 1);
colors.setXYZ(3, 0, 0, 1);
colors.setXYZ(4, 0, 1, 0);
colors.setXYZ(5, 0, 1, 0);
1 Like

Thanks!! It works! May I buy you a beer??? :smiley: