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

时间:2015-01-12 11:51:51

标签: cytoscape.js edges

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

我习惯使用cy.edges(selector)命令将特定的行颜色(红色)应用于带有源('I')的边缘。但这仅适用于已存在的边,但不适用于添加的边。

$('#cy').cytoscape({

ready:function(){

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' } }

                    ]

                },

});

这引出了几个相关的问题:

添加的边缘是否与现有边缘合并? 如果答案为“否”,我怎样才能让它们与edge []合并?

cytoscape.js-edgehandles.js中的相关代码是:

var edge = cy.add($ .extend(true,             {                 组:'边缘',                 数据:                 {                   source:source.id(),                   target:target.id()                 }              },options()。edgeParams(source,target,0)))。addClass(classes);

          added = added.add( edge );

          break;

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

谢谢,

Umbolt

1 个答案:

答案 0 :(得分:0)

您可以在样式表中使用classes来实现此目的。它们将采用样式表中指定的样式,无论它们何时被创建 - 类似于HTML中的CSS样式表。