Hi,
I do have a feature layer with some labeling info ,as part of a webmap, rendered in my app as below pasted.From the image it is can be clearly noticed that a push-pin marker has been obscured by the label. In spite of the graphic layer (with a point graphic created on demand having picture symbol marker which is an svg ) being at a higher index in the collection ,the rendering remains not seemingly right to my understanding.Tried a few things like re-ordering the layers,delayed adding of the graphic layer many times,but this behavior seems to be adamant.I am using the latest and greatest 4.11 js api. What am I doing wrong here ? Is there anyway to get the pin to come to the front and stay over the label ?
Solved! Go to Solution.
Hi Arun,
How about something like this?
https://codepen.io/noash/pen/PraaJg
If you have access to ArcGIS Pro, you could publish your layer with labels as a vector tile layer, and then consume that in your app as a VectorTileLayer instead of a webmap. The advantage here is that the labels would be baked into the layer, so you could draw graphics on the top. Does that help?
Hi Arun Sebastian - do you have a public webmap that you could share the URL to? Or a codepen/jsbin repro case?
Thanks for responding Bjorn .
Here is the webmap I use in the app
http://gbs.maps.arcgis.com/home/webmap/viewer.html?webmap=fe0ad272d0e74d45b38ff69525d3ca55
And below is the test code I used for adding graphic over the labels
Hi Arun,
This is the expected behavior. The label will always be above an added graphic.
Some questions for you: What is the expected outcome? If you want the graphic above (and partially or wholly blocking) the label, would removing the label entirely (when they collide) be a good outcome? If not, and you would still want to see a partial label, what is the use case for placing a graphic directly on top of a label?
Feel free to respond here or send me a direct message.
-Noah
Thanks a lot Noah!
Preferably the marker should stay always on top of all the visual elements ,regardless of whether they are labels or other graphics.I have a web map with a bunch of layers and labels serving as the map of the app.The business requirement is that, the center of the map always be marked and the address of the center or an attribute value of the particular feature beneath the center,if any, be displayed in the search widget on top of the map.This behaviour
has to be the same regardless of you pan,zoom ,resize etc.Any label which happens to be positioned at the center of the map obscures the marker.Is there a straight forward way to prevent this from happening(Any WebGL based solution? like any custom graphic layers as in https://developers.arcgis.com/javascript/latest/sample-code/custom-gl-visuals/index.html)? If no,is hiding the label when marker is on top ,is plausible?
Arun
Hi Arun,
How about something like this?
https://codepen.io/noash/pen/PraaJg
If you have access to ArcGIS Pro, you could publish your layer with labels as a vector tile layer, and then consume that in your app as a VectorTileLayer instead of a webmap. The advantage here is that the labels would be baked into the layer, so you could draw graphics on the top. Does that help?
Sorry for the delayed reply,yes this did solve my issue,though i had to convince the business to publish those labels in a single baked vector tile basemap!Thank you very much!