jsPlumb插入速度執行

Question

我正在使用jsPlumb庫來繪製（連接）一些div。 div的數量是動態的，可以達到2000 div。我使用下面的遞歸方法劃清界線：

connectGraphNodes: function(jsp_o, children, level){ 
    var nr_of_children, i=0; 

    nr_of_children = children.length; 
    for(i=0; i<nr_of_children; i++){ 
     if(!this.isPropertyEmpty(children[i]['id']) && !this.isPropertyEmpty(children[i]['name'])){ 
      // Connect child node with node 
      jsp_o.connect({ 
       source: 'es-org-graph-box-' + children[i]['parent'], 
       target: 'es-org-graph-box-' + children[i]['id'], 
       overlays:[ 
        [ "Label", { 
          label: children[i]['percentage']+'%', id:"label", 
          location: 1         
         } 
        ] 
       ] 
      }); 

      if(this.isSet(children[i]['children']) && children[i]['children'].length > 0){ 
       level++; 
       // Run recurence function for child-nodes 
       jsp_o.setSuspendDrawing(true); 
       this.connectGraphNodes(jsp_o, children[i]['children'], level); 
       jsp_o.setSuspendDrawing(false, true); 
      } 
     }    
    } 
} 

我的問題是，對於一個數大於100的加載時間是非常高，somethimes谷歌瀏覽器會彈出一個關閉標籤選項。我可以對我的方法做出任何改進，或者jsPlumb的速度很慢嗎？

Answer 1

像富已經提到的，你必須利用

jsPlumb.setSuspendDrawing(); 

方法

的嘗試：

connectGraphNodes: function(jsp_o, children, level){ 
    var nr_of_children, i=0; 

    nr_of_children = children.length; 
    //start of suspend drawing 
    jsPlumb.setSuspendDrawing(true); 
    for(i=0; i<nr_of_children; i++){ 
     if(!this.isPropertyEmpty(children[i]['id']) && !this.isPropertyEmpty(children[i]['name'])){ 
      // Connect child node with node 
      jsp_o.connect({ 
       source: 'es-org-graph-box-' + children[i]['parent'], 
       target: 'es-org-graph-box-' + children[i]['id'], 
       overlays:[ 
        [ "Label", { 
          label: children[i]['percentage']+'%', id:"label", 
          location: 1         
         } 
        ] 
       ] 
      }); 

      if(this.isSet(children[i]['children']) && children[i]['children'].length > 0){ 
       level++; 
       // Run recurence function for child-nodes 
       jsp_o.setSuspendDrawing(true); 
       this.connectGraphNodes(jsp_o, children[i]['children'], level); 
       jsp_o.setSuspendDrawing(false, true); 
      } 
     }    
    } 
    //end of suspend drawing 
    jsPlumb.setSuspendDrawing(false,true); 
}