JSPlumb在悬停时显示连接标签

moh*_*ied 3 javascript css hover jsplumb

我正在使用JSPlumb连接一堆块,我可以使用以下方法为连接设置标签:

JSPLUMB_INSTANCE.bind("connection", function (info) {
    info.connection.getOverlay("label").setLabel("w="+width+"<br>p="+pipelining);
});
Run Code Online (Sandbox Code Playgroud)

这样,标签始终在连接上可见.有没有办法让标签只出现在鼠标悬停上?

Rem*_*mco 7

我遇到了与你描述的相同的挑战,我的解决方案看起来像这样:

function setConnectionLabel(connection, label) {
    connection.bind("mouseenter", function(conn) {
        conn.addOverlay(["Label", { label: label, location:0.5, id: "connLabel"} ]);
    }); 

    connection.bind("mouseout", function(conn) {
        conn.removeOverlay("connLabel");
    });
}
Run Code Online (Sandbox Code Playgroud)

所以在你的情况下,这应该做的伎俩:

JSPLUMB_INSTANCE.bind("connection", function (info) {
    setConnectionLabel(info.connection, "Labeltext");
});
Run Code Online (Sandbox Code Playgroud)

让我知道它是否适合你,干杯!

更新:使用"mouseover"而不是"mouseenter"
新文档