rc-pannellum

just a simple code encapsulation, written in typescript and has some types inferable

original library pannellum

usage

yarn add rc-pannellum

import Pannellum, { PannellumRef } from 'rc-pannellum';
 
const App = () => {
  const viewerRef = useRef<PannellumRef | null>(null);
 
  useEffect(() => {
    // viewer instance
    const viewer = viewerRef.current?.getViewer();
    if (viewer) {
      viewer.on('mousedown', (e: MouseEvent) => {
        console.log(e);
      });
    }
  }, []);
 
  const config = {
    autoLoad: true,
    panorama: 'https://pannellum.org/images/alma.jpg',
  };
 
  return (
    <Pannellum
      ref={viewerRef}
      clickInfo
      className="viewer"
      style={{
        width: "100vw",
        height: "100vh"
      }}
      {...config}
    />
  );
};

props

name	type
style	CSSProperties	container style
className	string	container classname
clickInfo	boolean	console pitch and yaw when click