将特定 css 应用于 cytoscape 边缘句柄中的添加边缘

Question

我想将特定的 CSS（例如特定的线条颜色）添加到某些但所有添加了 cytoscape.js-edgehandles.js 的边。

我曾经使用cy.edges（选择器）命令将特定的线条颜色（红色）应用到带有源（'I'）的边缘。但这只适用于已经存在的边，而不适用于添加的边。

$('#cy').cytoscape({

就绪：函数（）{

window.cy = this;

cy.edges("[source='I']").addClass('red');

},

elements: {
                    nodes: [
                        { data: { id: 'I', name: 'Irlande' } },
                        { data: { id: 'H', name: 'Pays-Bas' } },
                        { data: { id: 'F', name: 'France' } },
                        { data: { id: 'L', name: 'Luxembourg' } }
                    ],
                    edges: [

                        { data: { source: 'I', target: 'F' } },

                        { data: { source: 'I', target: 'H' } }
                        { data: { source: 'I', target: 'L' } },
                        { data: { source: 'H', target: 'I' } },
                        { data: { source: 'H', target: 'F' } },
                        { data: { source: 'F', target: 'I' } },
                        { data: { source: 'F', target: 'H' } },
                        { data: { source: 'F', target: 'L' } },
                        { data: { source: 'L', target: 'I' } }

                    ]

                },

});

这让我想到了几个相关的问题：

添加的边是否与现有边合并？如果答案是 'no'，我怎样才能让它们与 edges[] 合并？

cytoscape.js-edgehandles.js中的相关代码为：

var edge = cy.add($.extend( true, { 群组：'edges'，数据： { 来源：source.id(), 目标：target.id() } }, options().edgeParams(source, target, 0))).addClass(类);

          added = added.add( edge );

          break;

        default:
          target.removeClass('edgehandles-target');
          break; // don't add anything
        }
      }

谢谢，

安全螺栓

Answer 1

有 classes 您可以在样式表中用于此目的。它们将采用样式表中指定的样式，无论它们何时创建——类似于 HTML 中的样式表。

将特定 css 应用于 cytoscape 边缘句柄中的添加边缘

applying specific css to added edges in cytoscape edgehandles

cytoscape.js

edges