VIMReact - Isolation

by simon_vimaec

HTML

<script>  
  window.process = { env: { NODE_ENV: 'development' } };
</script>
<script src="https://unpkg.com/react@18.2.0/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@18.2.0/umd/react-dom.development.js"></script>
<script src="https://unpkg.com/vim-webgl-component@0.3.8"></script>
<link rel="stylesheet" href="https://unpkg.com/vim-webgl-component@0.3.7/dist/style.css">

CSS

/*Makes full screen and remove scrollbars*/
      html,
      body {
        height: 100%;
        margin: 0;
        padding: 0;
        overflow: hidden;
        /*This prevents touches from being eaten up by the browser.*/
        touch-action: none;
      }

JavaScript

// create a component and setup callback
VIMReact.createVimComponent(async (cmp) =>{
 // Open a new vim file
  const vim = await cmp.loader.open(
    'https://vim02.azureedge.net/samples/residence.v1.2.75.vim',
    {
      rotation: new VIMReact.THREE.Vector3(270, 0, 0)
    }
  )
  
	// Find an object and isolate that object
  const object = vim.getObjectFromElement(777)// as VIM.IObject
  cmp.isolation.isolate([object], 'custom')
})