javascript - 将背景图像添加到 jsPlumb 中的连接器

Question

我想知道是否可以向连接器添加背景图像。

我的目标是创建这样的东西:

这样我就可以在背景中显示动画图像，象征连接的方向和类型。

Answer 1

据我所知这是不可能的，因为连接是由 SVG 对象组成的，而 SVG 对象本身充当背景图像。您可以尝试使用 dashstyle 选项，同时调整绘画样式和渐变以获得如图所示的适当箭头。更多引用:API DOC

示例代码:

jsPlumb.Defaults.PaintStyle = {
    lineWidth: 4,
    strokeStyle: 'rgba(123, 123, 123, 1)',
    gradient:{
              stops:[[0,"green"], [1,"red"]]
        },
    dashstyle: "7"
};

结果:

注意:请记住使用jsPlumb.setRenderMode(jsPlumb.SVG)，因为dashstyle不适用于jsPlumb.CANVAS(默认情况下为SVG)