Исправление положения подсказок Tipsy на путевых узлах Raphaël - PullRequest
Новая
       29

Исправление положения подсказок Tipsy на путевых узлах Raphaël

4 голосов
/ 19 февраля 2011

Это очень специфическая и несколько сложная проблема, поэтому я настроил минимальный тестовый пример , который вы, вероятно, должны увидеть перед прочтением остальной части этого.

У меня есть страница, на которой отображаются изображения с выделенными областями при наведении Raphaël . Я также работал над добавлением всплывающих подсказок к этим подсказкам, чтобы вы могли видеть, как называется каждая часть изображения.

Raphaël рисует выделенные области с помощью SVG, и поскольку элементы SVG также являются DOM-узлами, присоединение к ним Tipsy легко выполняется следующим образом: 

// Get the path node as a jQuery object.
pathNode = $(path.node);

// Set the title so it's available to tipsy.
pathNode.attr('title', element.title);

// Add a Tipsy tooltip to each node, if Tipsy is loaded.
if ($.fn.tipsy) {
  pathNode.tipsy({
    fade: true
  });
}

Проблема заключается только в мази, и причина этого вопроса в том, что Типси рисует всплывающую подсказку в верхней части экрана (с координатами 0,0) вместо рядом с узлом SVG, и я не могу понять как это исправить. При отладке Tipsy JavaScript у него, кажется, есть координаты в некоторой точке, но он все равно не может нарисовать в правильном месте.

Может кто-нибудь понять это? (Подробнее см. минимальный тест .)

Ответы [ 2 ]

2 голосов
/ 19 февраля 2011

Возможно, попробуйте использовать gRaphaël для этих советов.

Посмотрите на этот пример, который я только что написал: http://jsfiddle.net/3tHmp/

0 голосов
/ 20 февраля 2011

На вашем демо также отображаются всплывающие подсказки на iPhone на уровне 0,0. Когда фигуры становятся красными, вы можете определить min x и min y, используя getBBox () Поместите подсказку соответственно?

...