Azure maps symbols ignored intermittently on map creation

Question

Using angular 10 with typescript azure maps control -
I create 4 data sources and add pins based on status. Then I create 4 symbol layers to render the pins with different color markers, these are then added to the map.
After that completes hover layers are created for pop ups.

What we’re seeing is a failure of the map to use the symbol layers - randomly.

Each time the map loads I check to see if it’s initialized already and dispose first, if that’s the case.

The map always renders the correct number of pin’s and the hover, it’s just the markers are not drawn properly, rather the blue cluster pin appears. All data sources are created with cluster false.

Answer 1

I have this working now - it was the way I was creating the hover layer. I was creating a new hover layer for each of the 4 datasources. To fix the issue I added the mouse event to the symbol layer that was created for the different marker colors (those in turn were part of an image sprite).

So final arrangement is:
4 datasources for 4 types of pins
4 symbol layers to be for the different datasources and pop up events
4 image sprites for the 4 different colors.