GoJS的一些使用技巧

来源:互联网 发布:mac 音乐 编辑:程序博客网 时间:2024/04/30 05:34

修改图的内容

通过修改各种监听方法中得到的part内部的结构data等
或者直接遍历

myDiagram.model.nodeDataArraymyDiagram.model.linkDataArray//修改完成调用以下方法完成重建myDiagram.rebuildParts()

修改内容对应的data内容
调用即可

删除某个节点

myDiagram.remove(part)

通过全局变量获取某个选择的节点

var Select_Port = null;        myDiagram.addDiagramListener("ObjectSingleClicked", function(e) {                    Select_Port = e.subject.part;                });                myDiagram.addDiagramListener("ObjectContextClicked", function(e) {                    Select_Port = e.subject.part;                });

结合undoManager创建撤销重做删除的工具栏

            $('#deletePart').click(function(){                 if("undefined" == typeof myDiagram){                        result_prompt(0, "浏览器不兼容此功能,请使用高版本谷歌浏览器!");                        return false;                 }                 myDiagram.remove(Select_Port);            });            $('#undo-buttun').click(function(){             if("undefined" == typeof myDiagram){                    result_prompt(0, "浏览器不兼容此功能,请使用高版本谷歌浏览器!");                    return false;             }             myDiagram.undoManager.undo();            });            $('#redo-buttun').click(function(){             if("undefined" == typeof myDiagram){                    result_prompt(0, "浏览器不兼容此功能,请使用高版本谷歌浏览器!");                    return false;             }             myDiagram.undoManager.redo();            });

利用绘图过程中的一些DiagramListener完成更多的数据交互体验

可以在创建Diagram时进行创建对应的监听、通过遍历监听可以得到想要的组件

  myDiagram =                  goObj(go.Diagram, "myDiagramDiv",                      {                      initialContentAlignment: go.Spot.Center,                      allowDrop: true,                       "LinkDrawn": showLinkLabel,                        "LinkRelinked": showLinkLabel,                      "animationManager.duration": 800,                       "undoManager.isEnabled": true                      });function showLinkLabel(e) {                  var label = e.subject.findObject("LABEL");                  if (label !== null) label.visible = (e.subject.fromNode.data.figure === "RoundedRectangle");                }

也可以后面添加各种监听上去,具体事件可以查看API

                myDiagram.addDiagramListener("Modified", function(e) {                var button = document.getElementById("SaveButton");                  if (button) button.disabled = !myDiagram.isModified;                  var idx = document.title.indexOf("*");                  if (myDiagram.isModified) {                    if (idx < 0) document.title += "*";                  } else {                    if (idx >= 0) document.title = document.title.substr(0, idx);                  }                });                myDiagram.addDiagramListener("ExternalObjectsDropped", function(e) {                    try {                        e.subject.each(function(part) {                           //此处处理part                        );                    } catch (err) {                        console.warn(err);                    }                });
0 0