javascript - 联合js中的样式特定端口

Question

1）我正在使用 JointJS 图表库。我想inPort在使用joint.shapes.devs.

用于将 sourcePort 链接到我正在使用的目标

source: { id: source.id, selector: source.getPortSelector(sourcePort)}

它给了我准确的源端口，但是在知道它是我的源连接器之后如何在这个特定的端口上应用 css？有办法吗？

2）如果标签的宽度比元素宽度长，我们可以自动将标签放入/包裹在元素内吗？我正在使用joint.shapes.devs.Atomic元素。

遇到了foreignobject但是不知道怎么用？任何人都可以对此有所了解吗？

Answer 1

1)

myShape.attr('[port="a"]/fill', 'blue')

其中斜杠之前的第一个参数的第一部分是指向端口圆 SVG 元素的 CSS 选择器，第二部分是要在该元素上设置的 SVG 属性，第二个参数是要为该属性设置的值。做同样事情的另一种语法是：

myShape.attr({ '[port="a"]': { fill: 'blue' } })

详见attr()方法参考：http: //jointjs.com/api#joint.dia.Element :attr 。

2）joint.shapes.devs.Atomic形状不会自动这样做。您必须创建自己的形状，并通过foreighObjectJavaScript 或以编程方式在 JavaScript 中完成。作为使用的参考foreignObject，请参阅joint.shapes.basic.TextBlock此文件中定义的形状：https ://github.com/DavidDurman/joint/blob/master/plugins/joint.shapes.basic.js 。