Плагин jQuery vector-map: получить размеры страны - PullRequest
0 голосов
/ 06 января 2012

Я использую векторную карту jq-plugin, чтобы показать карту, на которой при наведении курсора мыши выделены страны. Когда страна нажата, она должна приблизиться к ней. Моя проблема в том, что я не смог выяснить, как получить размеры выбранной страны (минимальная / максимальная координата x / y), чтобы правильно масштабировать ее, чтобы охватить доступную область экрана.

Входными данными, из которых создается карта, является массив с элементами, имеющими следующий формат:

'lu': { 'lock':1, 'type':'country', 'name': 'Luxembourg', 'path': 'M233.7,335.91l-2.56,3.47l-1.08,5.64 c0.16,0.02,0.31,0.05,0.48,0.05c1.96-0.08,3.24-0.59,4.86,0c0.02,0.01,0.03,0.01,0.04,0.02l0.47-3.6L233.7,335.91z' }

У меня нет предыдущего опыта работы с svg или с этим плагином, поэтому, возможно, есть очевидное решение, которого я не вижу.

Также приветствуются предложения по альтернативным решениям, не основанным на этом плагине jq.

1 Ответ

0 голосов
/ 07 января 2012

Если path является переменной, ссылающейся на элемент пути, то path.getBBox() возвращает объект в следующей форме:

{
    x      : ...
    y      : ...
    width  : ...
    height : ...
}

Где x и y представляют левый верхний угол. Для масштабирования вы можете установить атрибут viewBox в элементе svg для переноса на viewBox="x y width height". Я имею в виду что-то вроде этого:

svg  = document.querySelector('svg');
path = svg.querySelector('path');
box  = path.getBBox();
svg.setAttributeNS(null, 'viewBox', box.x +' '+ box.y +' '+ box.width +' '+ box.height);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...