cytoscape.js 学习思路

对象类型：

在这些对象上面可以调用函数（默认情况下，会返回引用：例如obj.fn1().fn2().fn3()，除非文档另有说明，形成可连接方式）。这种现象对core和collection都使用，但是含多个元素的集合上调用单个- ele、node或edge函数将只返回第一个元素的期望值（这句话没理解呢）。

深度复制的需要

当将对象传递给Cytoscape.js以创建元素、动画、布局等时，这些对象被认为是由Cytoscape拥有的(进行深度拷贝，有性能消耗)。然而，对于大多数程序员来说，复制在大多数情况下都不是必要的。

手势支持：

抓取拖动背景、滚轮缩放、触摸屏-按压/手势向上or向下缩放、轻按节点选择，轻按背景取消、多重选择（shift, command, control, alt) + tap）、方框选择、拖拽节点。

这些收拾可以打开或者关闭。

位置：

包括model position 和 render position。model position是固定不变的，可以自动设置，也可以通过layout设置。可以通过edge的长度设置影响位置。

elements写法1：

 elements: [ // flat array of nodes and edges
    { // node n1
      group: 'nodes', // 'nodes' for a node, 'edges' for an edge
      data: { 
        id: 'n1',parent: 'nparent'
      }
    },

    { // node n2
      data: { id: 'n2' },
      renderedPosition: { x: 200, y: 200 } // can alternatively specify position in rendered on-screen pixels
    },

    { // node n3
      data: { id: 'n3', parent: 'nparent' },
      position: { x: 123, y: 234 }
    },

    { // node nparent
      data: { id: 'nparent' }
    },

    { // edge e1
      data: {
        id: 'e1',
        //  当source和target同时指定为，会指定为edge类型
        source: 'n1', 
        target: 'n2'  
        // (`source` and `target` can be effectively changed by `eles.move()`)
      },
    }
  ],

elements写法2：

 elements:{
node:[],
edges:[]
}

复合节点：

{id：“nparent”},{id:"1",parent:"nparent"}:复合节点的位置通过推导得出。针对一些函数，比如node.parent() node.neighoboerhood（） 会被特殊对待