Отображение всплывающей подсказки D3 при загрузке страницы

Я использую Tipsy для создания всплывающих подсказок о кругах SVG, созданных с помощью D3. Мой код взят прямо из этого примера. Используя этот код, мои всплывающие подсказки очень хорошо отображаются при наведении курсора на объекты круга:

$('.circles').tipsy({ title: 'My tooltip text' })

Есть ли способ отображения всплывающих подсказок при загрузке страницы, а не при наведении курсора? Я пытался использовать show, но это не похоже на работу:

$('.circles').tipsy({ title: 'My tooltip text' })      // show tips on hover
$('.circles').tipsy('show')                            // show tips on page load?

Получение подсказок для отображения всплывающих подсказок о загрузке страницы теоретически возможно на основе этого примера вопроса; однако я не могу понять, как манипулировать D3, чтобы заставить эту логику работать. Как сделать так, чтобы мои подсказки отображались при загрузке страницы и при наведении курсора?

1 ответ

Решение

Как ни странно - типсы плохо работают с селектором для каждого из этих кругов, поэтому пришлось использовать JQuery each функция, чтобы заставить его работать. Вы также должны установить опцию trigger: 'manual' в пьяном виде

$('.circles').each(function() {
   $(this).tipsy({ 
    trigger: 'manual',
    gravity: 'w', 
    html: true, 
    title: function() {
      return 'My tooltip text'; 
    }
   });

   $(this).tipsy('show');
});
Другие вопросы по тегам