I am currently trying to render CSS3D objects and WebGL objects in the same canvas, but I am currently having issues. Right now, my scene looks like the image below
This is how I render the two
function render() {
requestAnimationFrame(render);
domRenderer.render(scene, camera);
renderer.render(scene, camera);
}
this is how I create the renderers
// create renderers
domRenderer = new CSS3DRenderer();
domRenderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(domRenderer.domElement);
renderer = new THREE.WebGLRenderer( { alpha: true } );
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
What should I do to fix this issue