Клуб API Карт

Клуб API Карт

Своя метка и кликабельная область

Пост в архиве.

Добавляю Placemark с кастомной иконкой:

 

new ymaps.Placemark(
    [
        lat
        lng
    ]
    {}
    {
        iconLayout            : 'default#image'
        iconImageHref        : '/map-icons.png'
        iconImageSize        : [60, 58]
        iconImageOffset        : [-24, -58]
        iconImageClipRect    : [[60 * icon_number, 0], [60 * (icon_number + 1), 58]]
    }
)

Но клик по иконке распознается только в "силуете" стандартной иконки. Используя иконки вдвое большего размера или меньшего не удобно, так как клик по верхней части большой иконки просто не работает. При этом отображается всё вполне корректно.

Как пример большой иконки - синие на cherrytea.org

Использую API 2.1 beta

8 комментариев
Авторизуйтесь, чтобы оставить комментарий
zloylos
28 января 2016, 00:41
Нужно задать метке shape, соответствующий ее форме: http://api.yandex.ru/maps/doc/jsapi/beta/ref/reference/GeoObject.xml#param-iconImageShape
В placemark можно прописать шейп через опцию iconImageShape

nazar-pc
28 января 2016, 00:41

Я видел это в документации, но

Если не задана, то автоматически будет рассчитана прямоугольная фигура на основе размера и смещения картинки

фигура не соответствует размеру, и не прямоугольная.

Можно какой-то пример? (желательно и в документацию добавить)

zloylos
28 января 2016, 00:41
Да, можно описать метку полигоном.
Шейп нашей метки (запятая) описывается так:
var iconShapeCoords = [
            [
                [12, 27],
                [8, 39],
                [10, 41],
                [23, 24],
                [26, 20],
                [27, 15],
                [27, 12],
                [25, 6],
                [22, 3],
                [19, 1],
                [15, 0],
                [12, 0],
                [8, 1],
                [5, 3],
                [2, 6],
                [0, 12],
                [0, 15],
                [2, 21],
                [5, 24],
                [8, 26],
                [12, 27]
            ]
        ];

var iconShape = new ymaps.shape.Polygon(new ymaps.geometry.pixel.Polygon(iconShapeCoords))

Можете просто упрощенно обрисовать в каком-нибудь векторном редакторе и скопировать координаты, проследив, чтобы они были корректны (начало координат).

В документацию обязательно добавим примеры.
nazar-pc
28 января 2016, 00:41

А почему прямоугольник не рассчитывается автоматически?

sanarise
28 января 2016, 00:41

Автоматический расчет добавим в одной из следующих версий. Спасибо!

sanarise
28 января 2016, 00:41

Свою форму активной области можно задать через опцию iconImageShape

nazar-pc
28 января 2016, 00:41

Мне удалось заставить его работать, всё это весьма криво.

1) Почему массив координат в ещё одном массиве? (как по мне - избыточно)

2) iconImageShape полностью игнорирует iconImageOffset, что дико неудобно, и приходится к полученным координатам по очереди прибавлять смещение

nazar-pc
28 января 2016, 00:41

Если вложенность массива для создания сложных иконок из нескольких раздельных частей - то привести меньшую вложененость к большей элементарно:

if (arr[0] && arr[0][0] && !arr[0][0][0]) {
    arr = [arr]
}