Подсказка в Paper.js

Question

Я новичок в Paper.js. Пожалуйста, может кто-нибудь сказать мне, как отображать подсказку на объекте paper.js? Наконечник инструмента должен быть виден, когда мышь перемещается над объектом и должна исчезнуть, когда мышь удаляется от объекта.

спасибо.

Answer 1

При рисовании своего объекта, который вы хотите создать всплывающее окно для, сначала добавьте его в группу, а затем использовать OnMouseEnter и OnMouseLeave обработчиков на этом объекте:

// Create a group 
 
var group = new Group(); 
 
// Create a dot (circle the mouse will hover) 
 
var point = new Point(50, 50); 
 
var dot = new Path.Circle(point, 5); 
 
dot.fillColor = 'blue'; 
 
// Add dot to group 
 
group.addChild(dot); 
 

 
// Create onMouseEnter event for dot 
 
dot.onMouseEnter = function(event) { 
 
    // Layout the tooltip above the dot 
 
    var tooltipRect = new Rectangle(this.position + new Point(-20, -40), new Size(40, 28)); 
 
    // Create tooltip from rectangle 
 
    var tooltip = new Path.Rectangle(tooltipRect); 
 
    tooltip.fillColor = 'white'; 
 
    tooltip.strokeColor = 'black'; 
 
    // Name the tooltip so we can retrieve it later 
 
    tooltip.name = 'tooltip'; 
 
    // Add the tooltip to the parent (group) 
 
    this.parent.addChild(tooltip); 
 
} 
 

 
// Create onMouseLeave event for dot 
 
dot.onMouseLeave = function(event) { 
 
    // We retrieve the tooltip from its name in the parent node (group) then remove it 
 
    this.parent.children['tooltip'].remove(); 
 
}