How to implement 3D cursor

I’m making a 3D editor, but I’m wondering how to implement the 3D cursor (the up,down,left) arrow.

This cursor doesn’t occlude or can’t be occluded. With opengl, I usually draw the scene in 2 passes. during the first pass, I draw the scene. Then I clear the depth buffer or disable depth testing, and draw the cursor.

this way, the cursor will be always on top of everything. How do I do it with playcanvas?


Layers are your friend here

They will allow to render objects in a specific order by layer.

I tried it, it didn’t work well. I can’t disable occlusion . I unchecked depth test, but it made the object disappear.

I’m also very confused by “layers vs. sublayers” . For example, I create a cube and I want to assign it to the Immediate opaque layer, but I can’t. I don’t know why.

Do you have an example project to share?

this is the project

I’m sorry, I don’t know if you can visit. I’m new to PlayCanvas.

In this project, there is an object, called “Model”. That is supposed to be the cursor. But it’s transparent due to layer problems. I want it to be opaque and I don’t want it be occluded by anything.

I found the information hotspot project might be a good start point, however, I can’t seem to be able to add script into the scene, as the button is grayed out;

Hi @wegfagweg,

I think that happens because the entity you are trying to add a Script component already has one.

To add script files to an entity you use the script component on the right window (Inspector):


There seems to be a bug also. The first time I forked the above project and open,
the entity menu on the right side has no content:

Then, I opened the same project again in another chrome tab, the menu comes back

I think you might be right about this bug, @will I followed these steps and it is a repro:

  1. Forked the Information hotspots project from the Tutorials page.

  2. Opened the editor.

  3. Clicking on any entity results in any empty Inspector (no translation fields / components).

Reloading the browser fixes the issue. Tested on Firefox.

Is this effect what you are looking for? (The grey box being the cursor?)

Yes. I have achieved this:

But I believe I have found another rendering bug. As you can see, both arrows are red. I wanted to create another material in blue for one of the arrows.

Then, I saw weird issues. I simply duplicated the red material without any changes, and the new material can’t be rendered. it disappears in both the editor and the production viewer:

Another strange thing is, the material will be occluded by the skybox (sky cubemap)

I tried to reproduce this issue with a simpler scene for you to triage, but I couldn’t . The same issue doesn’t reproduce with the simpler scene:

I believe this is a bug, because the behavior is inconsistent.

This project reproduces the issue:

This is the simpler project that doesn’t reproduce:

what’s the best way to file bugs?

For Playcanvas engine related bugs you should submit an issue at the engine repository:


The issue with the entity inspector should be fixed now.