How to reset all VR object's z-index?

[mechwarr]

Hi ,
I try to add own "< div >" in your example , but I think your VR object z-axis is max , can I know how to set the z-index in this example?

[brianchirls]

I'm not entirely clear what you're asking, but I'll do my best.

I'm guessing you don't mean z-index, which is a CSS style property that doesn't apply here, but rather the position on the z axis, maybe?

While the x axis goes left/right (left is negative, right is positive) and the y axis goes up/down (down is negative, right is positive), the z axis goes front/back (away from the viewer is negative, toward the viewer is positive). Of course, that's just relative to where the viewer is looking when the simulation starts. If the viewer turns 90 degrees to the right, then the z axis becomes left/right.

One possible point of confusion here is that, while in many simulations, the viewer starts at [0, 0, 0] (a.k.a. the "origin"), here the viewer starts at [0, 1.5, 4]. That is, 1.5 meters high on the y axis, assuming the viewer is approximately that tall, and 4 meters "back" from the origin. The reason for this is so that any new objects created at the origin are immediately visible in front of you when you create them.

You are free to move any object, including the viewer. To move the object, do something like this:

VR.box() // create a box
  .moveTo(-1, 3, 1);

This example creates a box and moves it 1 meter to the left, 3 meters up and 1 meter "forward" or toward the viewer. The box will actually be 3 meters away from the viewer along the z axis, since the viewer is already 4 meters back.

While .moveTo() places an object at an absolute position within the world, you can also move it incrementally relative to itself with .moveX(), .moveY() or .moveZ(). .moveUp() is an alias for .moveY() and does the same exact thing. Also, every object has a .position and a .rotation property, which work the same way they do in three.js.

To move the viewer, there is an object called VR.body. You can set the position the same way. The camera is a "child" object of VR.body. If you try to move the camera, it will screw everything up, so move the body instead.

[mechwarr]

Sorry , I forget can't add div tag in here, and I should use another way to ask my question.

Have any idea to add image tag like the ex. '< img src="" width="300" height="300" >'?

[brianchirls]

you mean an image in VR or in github?

[mechwarr]

I mean an image in VR , but it's not VR image object.

I just want add UI object in your VR web example.

I know this question is very strange, but I'm just curious why VR always max be in this example of z-index, I mean this z axis not about VR three-dimensional space.