2017-06-14 4 views
0

Je souhaite séparer le style des schémas de couleurs dans un graphique Cytoscape.js 3.1. Selon http://js.cytoscape.org/#cy.style, j'initialise puis ajouter à cy.style():Cytoscape.js cy.style(). À partir deJson() ajouter au lieu de remplacer?

var mystyle = [ 
    { 
     "selector": "node", 
     "css": 
     { 
      "border-opacity": 1.0, 
      'label': function(ele) 
      { 
       if(ele.data('Labels_EN')) {return ele.data('Labels_EN')[0];} 
       ... 
     }, ... 
    ]; 

var bright = [ 
    { 
     "selector": "node", 
     "css": 
     {"background-color": "white";} 
    }]; 

cy = cytoscape(
    { 
     container: mycontainer, 
     style: mystyle 
    }); 

cy.style().fromJson(bright).update(); 

Malheureusement, l'appel à cy.style().fromJson() semble invoquer automatiquement cy.style().resetToDefault(), car il supprime le style existant. Comment puis-je empêcher Cytoscape.js de supprimer mon style existant et de l'ajouter à l'aide de JSON? J'ai besoin de cette fonctionnalité pour ne pas avoir à mettre les informations de style complètes dans tous mes schémas de couleurs, ce qui rend la maintenance plus difficile.

P.S .: Pour contourner ce problème, je fusionne deux fichiers de style comme celui-ci:

function mergeJsonArraysByKey(a1,a2) 
{ 
    let map1 = new Map(); 
    let map2 = new Map(); 
    for(i=0;i<a1.length;i++) {if(a1[i].selector) {map1.set(a1[i].selector,a1[i]);}} 
    for(i=0;i<a2.length;i++) {if(a2[i].selector) {map2.set(a2[i].selector,a2[i]);}} 
    let merged = []; 
    map1.forEach((value,key,map) => 
    { 
     if(map2.has(key)) 
     { 
      merged.push($.extend(true,{},value,map2.get(key))); 
     } else 
     { 
      merged.push(value); 
     } 
    }); 
    map2.forEach((value,key,map) => 
    { 
     if(!map1.has(key)) 
     { 
      merged.push(value); 
     } 
    }); 
    return merged; 
} 

function initGraph(container, graph) 
{ 
    let merged = mergeJsonArraysByKey(mystyle,bright); 
    cy = cytoscape(
    { 
     container: container, 
     style: merged 
    }); 
} 

Répondre

2

fusion JSON plutôt que annexant à la feuille de style. Vous pouvez faire ce que vous voulez avec le json, tandis que cy.style() peut être modifié uniquement de façon particulière pour éviter les problèmes.

cy.style().fromJson(sheetA.concat(sheetB))

+0

La réponse est modifiée – maxkfranz