gojs实现可拖动分组效果代码-html代码-BFW代码库

gojs实现可拖动分组效果代码

代码语言：html

所属分类：拖放

代码描述：gojs实现可拖动分组效果代码

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

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    </head>
  <body>
  <script src="//repo.bfw.wiki/bfwrepo/js/go.js"></script>

  <div id="allSampleContent" class="p-4 w-full">
    <script id="code">
    function init() {

      myDiagram = new go.Diagram("myDiagramDiv",
          {
            // when a drag-drop occurs in the Diagram's background, make it a top-level node
            mouseDrop: e => finishDrop(e, null),
            layout:  // Diagram has simple horizontal layout
              new go.GridLayout(
                { wrappingWidth: Infinity, alignment: go.GridLayout.Position, cellSize: new go.Size(1, 1) }),
            "commandHandler.archetypeGroupData": { isGroup: true, text: "Group", horiz: false },
            "undoManager.isEnabled": true
          });

      // The one template for Groups can be configured to be either layout out its members
      // horizontally or vertically, each with a different default color.

      function makeLayout(horiz) {  // a Binding conversion function
        if (horiz) {
          return new go.GridLayout(
            {
              wrappingWidth: Infinity, alignment: go.GridLayout.Position,
              cellSize: new go.Size(1, 1), spacing: new go.Size(4, 4)
            });
        } else {
          return new go.GridLayout(
            {
              wrappingColumn: 1, alignment: go.GridLayout.Position,
              cellSize: new go.Size(1, 1), spacing: new go.Size(4, 4)
            });
        }
      }

      function defaultColor(horiz) {  // a Binding conversion function
        return horiz ? "rgba(255, 221, 51, 0.55)" : "rgba(51,211,229, 0.5)";
      }

      function defaultFont(horiz) {  // a Binding conversion function
        return horiz ? "bold 20px sans-serif" : "bold 16px sans-serif";
      }

      // this function is used to highlight a Group that the selection may be dropped into
      function highlightGroup(e, grp, show) {
        if (!grp) return;
        e.handled = true;
        if (s.........完整代码请登录后点击上方下载按钮下载查看