Клуб API Карт

Свои иконки на маркерах, как узнать координаты на изображение?

Михаил Иванов
3 мая 2016, 14:54

Подскажите технологию создания изображения и как узнать положение на картинки для получения iconImageClipRect. Есть ли стандартная сетка или что то на подобие.

Выдернул с одного сайта

т.е. например для получения капли  iconImageClipRect :[257, 129] [320, 193]

4 комментария
Стандартной нет, иконки то у всех разные. Я бы сделал отдельный модуль, добавляющий для всех иконок в спрайте ключи в option.presetStorage, а в проектном коде использовал бы эти ключи (как со стандартными иконками)
Михаил Иванов
3 мая 2016, 19:14
dimik,
т.е. каждая иконка отдельно в хранилище. Был бы рад видеть пример. Спасибо
Михаил Иванов
3 мая 2016, 19:49
dimik,
https://tech.yandex.ru/maps/doc/jsapi/2.0/ref/reference/mapType.storage-docpage/ что похожее только 2.0 и карта в хранилище 
Михаил Иванов,
Нет, я про хранилище стилей options.presetStorage


Пример несложный, нужно знать Javascript и чтобы руки не из Ж, типа такого:


var iconWidth = _ширина_иконки_;
var iconHeight = _высота_иконки_;
var myIconsSprite = {
    iconImageHref: '_урл_до_спрайта_',
    iconImageSize: [iconWidth, iconHeight];
    iconImageOffset: [iconWidth / 2, IconHeight / 2],
}


// Далее нужно сформировать массив-описание спрайта
var myIconsSpriteDescription = [
  ['house', 'monument', 'unesco', ...],
  ['pyramid', ...],
  ['fir-tree', 'plain-tree'],
  [...],
  [...]
];


// Далее пройтись по описанию и сформировать пресеты
myIconsSpriteDescription.forEach(function (icons, levelHeight) {

  icons.forEach(function (iconName, levelWidth) {
    ymaps.option.presetStorage.add('myIcon#' + iconName, ymaps.util.extend({
       iconImageClipRect: [
         [iconWidth * levelWidth, iconHeight * levelHeight],
         [iconWidth * levelWidth + iconWidth, iconHeight * levelHeight + iconHeight]
       ]
    }, myIconsSprite));
  });
});


// Далее просто использовать пресет при создании метки:
var myPlacemark = new ymaps.Placemark(_coords_, {
    balloonContent: 'Метка с иконкой дома'
  }, {
    preset: 'myIcon#house'
  });