usePano.jsx 789 B

12345678910111213141516171819202122232425262728293031
  1. import { useRef, useEffect } from "react";
  2. /* global google */
  3. const usePano = (panoDivRef, { lat, lng }, { heading, pitch }) => {
  4. const panoRef = useRef(null);
  5. useEffect(() => {
  6. const position = { lat, lng };
  7. const pov = { heading, pitch };
  8. if (panoRef.current) {
  9. panoRef.current.setPosition(position);
  10. panoRef.current.setPov(pov);
  11. return;
  12. }
  13. panoRef.current = new google.maps.StreetViewPanorama(panoDivRef.current, {
  14. position,
  15. pov,
  16. fullscreenControl: false,
  17. addressControl: false,
  18. showRoadLabels: false,
  19. clickToGo: true,
  20. visible: true,
  21. motionTracking: false,
  22. motionTrackingControl: false,
  23. });
  24. }, [panoDivRef, lat, lng, heading, pitch]);
  25. return panoRef;
  26. };
  27. export default usePano;