javascript - 动态拖动文本

Question

使用 Kinetic，是否可以在文本上设置鼠标悬停？下面的代码不起作用。如果用矩形替换文本，效果很好。

...
var layer = new Kinetic.Layer();

var test = new Kinetic.Text({
    x: 20,
    y: 20,
    text: "test",
    textFill:"black"
});

test.on("mouseover", function(){
    alert("mouseover");
});

layer.add(test);

感谢您的帮助!

更新:

好吧，我又搜索了一下，看来还是需要用到像素检测。

see this tutorial fore more details

目前的结果并不完美，但聊胜于无

Answer 1

我在处理类似的文本行为时遇到了麻烦，在深入了解存储库历史后，我发现现在 Text 默认将 detectionType 设置为“pixel”。

尝试像下面这样更改您的文本声明:

var test = new Kinetic.Text({
    x: 20,
    y: 20,
    text: "test",
    textFill: 'black',
    detectionType: 'path',
    draggable: true         
});