I tried using CSS3DRenderer to render an iframe video, and the final result is displayed correctly. However, in the viewport of the Verge3D editor, there is misalignment unless the viewport size is enlarged to almost fullscreen. To solve this issue, I had an idea of adding an event function to the viewport similar to “window.addEventListener(‘resize’, resize)”. Since there is no documentation available for this specific part, I would appreciate any hints or relevant code that could help resolve this problem. I have attached an image showing the misalignment.
`function makeIframeObject(width, height) {
const obj = new v3d.Object3D();
const element = document.createElement(‘iframe’);
element.style.width = width + ‘px’;
element.style.height = height + ‘px’;
var css3dObject = new CSS3DObject(element);
obj.css3dObject = css3dObject;
obj.add(css3dObject);
var material = new v3d.MeshPhongMaterial({
———-
});
var geometry = new v3d.BoxGeometry(width, height, 1);
var mesh = new v3d.Mesh(geometry, material);
mesh.castShadow = true;
mesh.receiveShadow = true;
obj.add(mesh);
return obj;
}
-
This topic was modified 1 year, 5 months ago by aqiang.
-
This topic was modified 1 year, 5 months ago by aqiang.
Attachments:
You must be
logged in to view attached files.