For example, I’d like all positions of all objects to be from top/left like with DOM CSS. For example, X goes to the right, starting at 0 from the left edge of a parent/viewport, and positive Y goes downward, starting from the top of a parent/viewport. I’d like for an object that is added directly …

Alright, I finally did it. Here’s what I was aiming for (see the HTML): Notes This is a simple demo to show that the “dom elements” intersect each other as well as with WebGL Meshes, and receive shadow and light. Use case: mixing traditional web content with 3D content in an easy way (it’s simp…

How can we make Three.js scenes use DOM-style coordinates?

Questions

mrdoob October 15, 2017, 5:05pm 3

I think I might be able to achieve this by setting the matrix of a THREE.Scene, where the matrix will ultimately map all world matrices to the DOM space.

That may work. Give it a try

[SOLVED] How do we size something using screen pixels

Topic		Replies	Views
[SOLVED] How do we size something using screen pixels Questions coordinate-system	8	25734	January 15, 2019
Using the THREE.js CSS2DRenderer to position HTML elements from the top left Questions css-renderer , html , css2dobject	2	3337	May 20, 2022
Sync DOM element movement on Z axis to be the same with WebGL 3DObject movement Questions css3drenderer	0	565	March 19, 2022
Matrix4 to CSS matrix3d without CSSRenderer Questions math , matrix4	2	436	November 11, 2023
How to fit the scale, position between Unity and web browser(three.js)? Questions coordinate-system	2	1631	January 27, 2020

How can we make Three.js scenes use DOM-style coordinates?

Related topics