SDK Mode moveTo Bug
by Jowed
HTML
<head>
<script src="https://static.matterport.com/showcase-sdk/latest.js"></script>
</head>
<body>
<div class="container">
<iframe id="showcase-iframe" allow='xr-spatial-tracking' frameborder='0'></iframe>
<button id="btn-test">
Test me
</button>
</div>
</body>
CSS
*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
.container{
width: 100vw;
height: 100vh;
display: flex;
flex-flow: column nowrap;
}
#showcase-iframe{
width: 100%;
height: 100%;
}
JavaScript
const key = "6eb9607db19546aebe10dce90aa001fa"; // jsfiddle key
const modelSid = "JGPnGQ6hosj"; // change to custom model SID
const urlParameters = "&play=1&qs=1";
const iframe = document.getElementById('showcase-iframe')
function connect() {
window.MP_SDK.connect(iframe, key, '')
.then(loadedShowcaseHandler, console.error);
}
iframe.onload = connect;
iframe.src = `https://my.matterport.com/show/?m=${modelSid}${urlParameters}`;
function loadedShowcaseHandler(mpSdk) {
console.debug("Connected to the SDK");
recreateIssue(mpSdk);
}
function recreateIssue(mpSdk){
// Recreate the issue here
mpSdk.Camera.pose.subscribe(data => {
console.log(data);
})
/* document.getElementById('btn-test').addEventListener('click', () => {
}); */
/* mpSdk.Mode.moveTo(data.mode, {
position: data.position,
rotation: data.rotation,
transition: "transition.fly",
}); */
}