Answer the question
In order to leave comments, you need to log in
How to influence the content styles inside the custom marker Yandex maps?
It is required to place numbers (1,2,3...) in custom markers on the map. It seems not a problem - we take the iconContent property and stuff the number there, but we still need to fasten the styles for the font inside the marker. Good - we change it through css (which I think is not good, because I think there is some way to hang your css class on a custom marker).
It looks as it should, but - when you hover the mouse cursor, the marker should change its appearance: the background color changes and, accordingly, the font color should change. I hang the mouseenter and mouseleave events on the marker using api, replacing the marker image, while changing the color of the numbers inside the marker through styles.
The next problem is:
Markers are attached to the list of links with addresses, which is displayed next to the map, when hovering over the link, the corresponding marker on the map should react. I programmatically call events on the marker, and then a problem arises - the marker changes the icon, but the styles for the text inside the label are not applied, since they are written in css.
Is it possible to influence the style of the content inside the marker by assigning a css class to the marker when mouse events are triggered on it?
Answer the question
In order to leave comments, you need to log in
In general, dug up the answer. Since such customization is in progress, it is better to use the layout factory from the templateLayoutFactory templates.
Through this constructor, we set the content output template for the label
var commonContent = ymaps.templateLayoutFactory.createClass('<div class="icn_content">$[properties.iconContent]</div>');
var hoverContent = ymaps.templateLayoutFactory.createClass('<div class="icn_content hover">$[properties.iconContent]</div>');
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question