player-react
CameraBar

CameraBar

Camera toolbar for switching between 2D/3D views, perspective/orthographic cameras, auto-rotation, and custom camera angles.

How to Use

  • Enable the camera toolbar quickly by configuring addons={["CameraBar"]}
  • Or manually enable it by importing import { CameraBar } from "@icraft/player-react". Manual enabling allows more flexible control over the camera toolbar's style.

The custom camera switching control will only be displayed when custom cameras are added in the editor

import { ICraftPlayer, CameraBar } from "@icraft/player-react";
 
const style = {
  width: "100%",
  height: "100%",
  position: "relative" as const,
  overflow: "hidden" as const,
};
 
const CameraBarStyle = {
  left: "initial",
  transform: "translateX(0%)",
  bottom: "10px",
  right:'10px'
};
 
export default () => {
  return (
    <div style={style}>
      <ICraftPlayer
        src='/templates/AWSCloud.iplayer'
        // addons={["CameraBar"]}
        addons={<><CameraBar style={CameraBarStyle} /></>}
      />
    </div>
  );
};
 
 

API

NameDescriptionTypeDefaultRequired
styleStyleReact.CSSPropertiesfalse
classNameClass namestringfalse