drei icon indicating copy to clipboard operation
drei copied to clipboard

GizmoHelper / GizmoViewport don't work when matrix auto updates are off

Open gewesp opened this issue 1 year ago • 0 comments

  • three version: 0.149.0
  • @react-three/fiber version: 8.10.4
  • @react-three/drei version: 9.56.18
  • node version: v18.16.0
  • npm (or yarn) version: 9.5.1

Problem description:

We have to turn off matrix auto update globally for performance reasons. Apparently, this breaks the behavior of the mentioned components and no axes appear on the screen. It works fine if matrix auto updates are enabled in the same code.

Relevant code:

Object3D.DEFAULT_MATRIX_AUTO_UPDATE = false;
Object3D.DEFAULT_MATRIX_WORLD_AUTO_UPDATE = false;

// ....

export function MyAxesIndicator() {
  return (
    <GizmoHelper
      alignment="bottom-right"
      margin={[60, 60]}
    >
      <GizmoViewport
        disabled
        axisColors={["red", "lime", "#00FFFF"]}
        hideNegativeAxes
        labels={["N", "E", "D"]}
        labelColor="black"
      />
    </GizmoHelper>);
}

Suggested solution:

It may be a simple matter of explicitly forcing matrixAutoUpdate and/or matrixWorldAutoUpdate to true for the objects that need it, or explicitly updating the matrices in an useFrame() internal to the gizmo components.

gewesp avatar Sep 19 '23 16:09 gewesp