gojs+dagre实现自动布局流程图效果代码-html代码-BFW代码库

gojs+dagre实现自动布局流程图效果代码

代码语言：html

所属分类：图表

代码描述：gojs+dagre实现自动布局流程图效果代码，设置了右键菜单，可以删除和克隆节点。

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">




</head>

<body onload="init()">
    <div id="sample">
        <button onclick="autolayout()">auto layout</button>
        <button onclick="duplicateNode()">duplicateNode</button>
        <p>right click for context menu</p>
        <div id="myDiagram" style="background-color: whitesmoke; border: solid 1px black; width: 100%; height: 400px"></div>
    </div>


    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/go.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/dagre.min.js"></script>
    <script>
        var nodes, links, myModel, $, myDiagram;
        
        function generateNodeDataArray() {
          var nodeDataArray = [];
          for (n in nodes) {
            var nodeData = { key: n, label: nodes[n].label };
        
            if (nodes[n].x && nodes[n].y) {
              nodeData.locat.........完整代码请登录后点击上方下载按钮下载查看