nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Stacking Order with graphics and 3D Layers in SceneView

DanielDormont

Hi,

I am building a 3D Map and trying to understand how to make my custom graphics appear correctly "over" 3D structures such as the OSM Buildings layer. I created a simple codepen here: https://codepen.io/dandormont-the-decoder/pen/MWVdrgQ What you can see is that as the map begins to load, my custom graphic - the little green rectangle with a cross on it - shows up. But then as the buildings layer that I added to my web scene begin to appear, it gets blocked by the building, and you have to zoom _way_ out for it to appear again. Is there a way to make my graphic show up through the building at all zoom levels?

Caveat: if it's not obvious, this is my first 3D map and for that matter my first ArcGIS Javascript project 🙂

Thanks,
Dan

Najděte více příspěvků označených jako

Accepted answers

Anonymous User

Hey @DanielDormont

Yes this is currently not possible in the 3D JSAPI. It would also make it hard to figure where the symbols are exactly placed since they could be close or far away. If you want your symbols to stick out more you can also use callouts, which place the symbols further above the ground and connects them to the ground with a line. I modified your codepen a bit to show you an example: https://codepen.io/dlaumer/pen/MWVdPNK

Hope this helps,

Daniel

All comments

DanielDormont

Huh. Yet another thing I didn't know about 🙂 Alright, I have some more research to do. Thanks for all the help.

Anonymous User

Hey @DanielDormont

Hope this helps,

Daniel

DanielDormont

Hi @Anonymous User ,

Thanks for the reply, that's helpful. I guess, coming from a 2D world, I had imagined this as not so much an elevation issue, but more akin to something like a z-index where the graphic would appear even if there is something else in its spot. Basically that portion of the building would be obscured by my graphic, rather than the other way around. Perhaps that concept doesn't really apply to 3D?

Anyway, I think this gives me a good starting point. To be honest I didn't know I could create my own layers for graphics. So that's good to know too.

dan

Anonymous User

Hi @DanielDormont ,

The issue here is that the point geometry you're creating doesn't have the elevation (z-value) specified, only the longitude and latitude. In such a case, the point is automatically aligned to the ground and then, as you mentioned, gets blocked by the buildings. When zooming out at some point the buildings are not rendered anymore and the symbol shows up again.

What you can do is to position the symbol on top of everything in the scene To do that, there are two options. Firstly, you can give the point geometry a Z value, e.g. z:20 would elevate the point 20 meters above the ground so that the icon is shown hovering over the low building. Secondly, you could place the graphics onto a layer and use the elevationInfo property to align anything on that layer above all the objects in the scene. (The graphics added to view.graphics are not inside of a layer). Additionally you can also add an offset to be sure the symbol is not half inside of the building. I adapted your codepen here: https://codepen.io/dlaumer/pen/MWVdPNK

Of course the symbol is still not shown when it is behind another, taller building. Is this sufficient or did you want the symbol to always render in front of everything?

Just feel free to ask any follow up questions,

Daniel

Připojte se k diskusi

Přihlášení členové mohou přispívat, sledovat aktualizace a další. Jste tu noví? Zaregistrujte si bezplatný účet.

Rychlé odkazy

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.