画布监听事件 API
节点生成事件 externalobjectsdropped
线生成事件 LinkDrawn
线重新连接事件 LinkRelinked
删除后事件 SelectionDeleted
删除前事件 SelectionDeleting 例子入口
节点移动事件 SelectionMoved
- // 监听节点或线的删除事件
- myDiagram.addDiagramListener("SelectionDeleted", function(e) {
- e.subject.each(function(n){
- console.log(n.data.key);
- });
- })
自动布局 API
PS: 这里只写比较常用布局, 其他布局请查询官网 API
网格布局 go.GridLayout
力导向布局 go.ForceDirectedLayout
树形布局 go.TreeLayout
径向布局 (需要引 RadialLayout.JS) RadialLayout
- // 用例定义画布节点为网格布局
- myDiagram =
- $(go.Diagram, "myDiagramDiv", // 画布定义
- {
- layout:$(go.GridLayout, // 自动布局定义, 设置为网格布局
- {
- comparer: go.GridLayout.smartComparer,// 设置从小到大排序
- spacing: go.Size.parse("20 20"),// 设置节点间隔
- comparer: function(a, b){
- // 重写布局算法, 根据其他属性值重新增设置顺序
- var ay = a.data.type;
- var by = b.data.type;
- if(!!ay&&!!by){
- if(ay> by) return -1;
- if(ay < by) return 1;
- }else if(!!ay){
- return -1;
- }else if(!!by){
- return 1;
- }
- }
- });
- });
来源: http://www.bubuko.com/infodetail-3039766.html