Elius94/issue14

[Elius94]

Now The library is based on the psv version 5.0.0.

Library Version

Original Wrapped Library: PhotoSphereViewer Version: 5.0.0 [NEW] Now the component version is composed by the semantic version of the wrapper and the version of the original library. For example, the current version is 2.1.4-psv5.0.0. This means that the wrapper is in version 2.1.4 and the original library psv is in version 5.0.0.

Calling plugin methods and handling events from outside the component NEW

To handle events from outside the component, you need to declare the callback function in the onReady(instance: Viewer) prop. The instance is the instance of the viewer. You can call the plugin methods using the instance.getPlugin() method. The instance.getPlugin() method returns the plugin instance. You can call the plugin methods using the plugin instance.

const handleReady = (instance) => {
  const markersPlugs = instance.getPlugin(MarkersPlugin);
  if (!markersPlugs)
    return;
  markersPlugs.addMarker({
    id: "imageLayer2",
    imageLayer: "drone.png",
    size: { width: 220, height: 220 },
    position: { yaw: '130.5deg', pitch: '-0.1deg' },
    tooltip: "Image embedded in the scene"
  });
  markersPlugs.addEventListener("select-marker", () => {
    console.log("asd");
  });
}

return (
  <div className="App">
    <ReactPhotoSphereViewer src="Test_pano.jpg" plugins={plugins} height={'100vh'} width={"100%"} onReady={handleReady}></ReactPhotoSphereViewer>
  </div>
);