Ответ — пресеты. Создаёте, сохраняете (как видно, объекты практически аналогичны и их нужно просто клонировать, меняя один параметр). А дальше — что захотите. Пресетов может быть сколько угодно с любыми именами.
Update: По молчаливой просьбе собеседника добавил сторонние элементы
var points = [
[55.831903,37.411961],
[55.763338,37.565466],
[55.763338,37.565466],
[55.744522,37.616378],
[55.780898,37.642889]
],
markers = {};
ymaps.ready(function () {
ymaps.option.presetStorage.add('custom#default', {
iconLayout: 'default#image',
iconImageHref: 'marker.png',
iconImageSize: [30, 40],
iconImageOffset: [-15, -40],
iconImageClipRect: [
[0, 30],
[30, 70]
],
hideIconOnBalloonOpen: false
});
ymaps.option.presetStorage.add('custom#active', {
iconLayout: 'default#image',
iconImageHref: 'marker.png',
iconImageSize: [30, 40],
iconImageOffset: [-15, -40],
iconImageClipRect: [
[0, 70],
[30, 110]
],
hideIconOnBalloonOpen: false
});
var myMap = new ymaps.Map('map', {
center: [55.751574, 37.573856],
zoom: 9
});
for (var i = 1; i <= points.length; i++) {
markers['id' + i] = new ymaps.Placemark(
points[i - 1],
{
hintContent: 'Какая красивая метка...'
},
{
preset: 'custom#default'
}
);
$('<a href="#" data-type="marker" data-id="id' + i + '">').html(i + '-я метка').appendTo($(document.body));
}
placemark.events.add('click', function (e) {
changeMarker(e.get('target'));
});
myMap.geoObjects.add(placemark);
});
function changeMarker (marker) {
marker.options.set('preset', {
preset: 'custom#active'
});
}
$(document).on('click', 'a[data-id][data-type="marker"]', function (e) {
e.stopPropagation();
e.preventDefault();
changeMarker(markers[$(this).data('id')]);
});
Метка тут такая
