useSupplyChainContext

A hook that provides access to the SupplyChainModel which has various functions that can be used to interact with the SupplyChain. It can only be used inside a SupplyChain component or a SupplyChainProvider.

 function SupplyChainWrapper() {
   const { fitContent, zoomTo } = useSupplyChainContext()

   return (
     <>
       <SupplyChain data={data} contextMenuItems={item => {
           if (item) {
             return [{ title: 'Zoom to Item', action: () => zoomTo([item]) }]
           }
           return []
         }}>
       </SupplyChain>
       <div style={{position: 'absolute', top: '20px', left: '20px'}}>
         <button onClick={() => fitContent()}>Fit Content</button>
       </div>
     </>
   )
 }

 function SupplyChainComponent () {
   return (
     <SupplyChainProvider>
       <SupplyChainWrapper></SupplyChainWrapper>
     </SupplyChainProvider>
   )
 }

Returns

SupplyChainModel