历史回溯，样式调整

 <template>
 <template>
   <div class="lshs-content">
   <div class="lshs-content">
-      <div class="slot">
-          <div><span class="tip-title">范围属性变更：</span></div>
-          <div><span class="tip-title">宗地分割：</span></div>
-          <div><span class="tip-title">宗地合并：</span></div>
-      </div>
+<!--      <div class="slot">-->
+<!--          <div><span class="tip-title">范围属性变更：</span></div>-->
+<!--          <div><span class="tip-title">宗地分割：</span></div>-->
+<!--          <div><span class="tip-title">宗地合并：</span></div>-->
+<!--      </div>-->
     <div id="mountNode" ref="containerWidth"></div>
     <div id="mountNode" ref="containerWidth"></div>
+    <div id="mountNodeRight"></div>
   </div>
   </div>
 </template>
 </template>
 
 
@@ -51,9 +52,9 @@ export default {
           drawShape(cfg, group) {
           drawShape(cfg, group) {
             const rect = group.addShape('rect', {
             const rect = group.addShape('rect', {
               attrs: {
               attrs: {
-                x: -75,
+                x: -100,
                 y: -25,
                 y: -25,
-                width: 150,
+                width: 200,
                 height: 50,
                 height: 50,
                 radius: 10,
                 radius: 10,
                 stroke: '#5B8FF9',
                 stroke: '#5B8FF9',
@@ -83,38 +84,14 @@ export default {
         'single-node',
         'single-node',
       );
       );
       G6.registerEdge(
       G6.registerEdge(
-        'circle-running',
+        'polyline1',
         {
         {
-          afterDraw(cfg, group) {
-            const shape = group.get('children')[0];
-            const startPoint = shape.getPoint(0);
-
-            const circle = group.addShape('circle', {
-              attrs: {
-                x: startPoint.x,
-                y: startPoint.y,
-                fill: '#1890ff',
-                r: 3,
-              },
-              name: 'circle-shape',
-            });
-
-            circle.animate(
-                    (ratio) => {
-                      const tmpPoint = shape.getPoint(ratio);
-                      return {
-                        x: tmpPoint.x,
-                        y: tmpPoint.y,
-                      };
-                    },
-                    {
-                      repeat: true,
-                      duration: 3000,
-                    },
-            );
-          },
+            afterDraw(cfg, group) {
+                console.log(cfg.data+":cfg")
+                console.log(group.toString()+"group")
+            },
         },
         },
-        'line',
+        'polyline',
       );
       );
 
 
       const tooltip = new G6.Tooltip({
       const tooltip = new G6.Tooltip({
@@ -146,33 +123,24 @@ export default {
         layout: {
         layout: {
           type: 'dagre',
           type: 'dagre',
           nodesepFunc: (d) => {
           nodesepFunc: (d) => {
-            if (d.id === '3') {
-              return 500;
-            }
-            return 50;
+            return 100;
           },
           },
-          ranksep: 70,
+          ranksep: 30,
           controlPoints: true,
           controlPoints: true,
         },
         },
         defaultNode: {
         defaultNode: {
           type: 'sql',
           type: 'sql',
         },
         },
         defaultEdge: {
         defaultEdge: {
-          type: 'polyline',
+          type: 'polyline1',
           style: {
           style: {
-            radius: 20,
-            offset: 45,
-            endArrow: true,
+            radius: 10,
+            offset: 10,
+            // endArrow: true,
             lineWidth: 2,
             lineWidth: 2,
             stroke: 'rgba(78,142,230,0.45)',
             stroke: 'rgba(78,142,230,0.45)',
           },
           },
         },
         },
-        //   defaultEdge: {
-        //       type: 'cubic-vertical',
-        //       style: {
-        //         stroke: '#F6BD16',
-        //       },
-        //   },
         nodeStateStyles: {
         nodeStateStyles: {
           selected: {
           selected: {
             stroke: '#d9d9d9',
             stroke: '#d9d9d9',
@@ -221,44 +189,12 @@ export default {
     getLshsData(){
     getLshsData(){
       let _this = this;
       let _this = this;
       const data = {
       const data = {
-        "bsm": "c0818d9e4286b35b8ee9b96d90b522aa",
+        "bsm": "d85a274a332ad2d35c922a3a95eb154f",
         "type": "zd"
         "type": "zd"
       };
       };
       getLshs(data).then((res)=>{
       getLshs(data).then((res)=>{
         if(res.code===200){
         if(res.code===200){
           _this.data=res.result;
           _this.data=res.result;
-          _this.data = {"nodes":[
-                  {"id":"836524edab33ab19bb0e0b4fd064cd77","dataType":"sql","name":"20201127宗地A",
-                        "conf":[{"label":"宗地代码","value":"610102123666GA10002"},{"label":"项目名称","value":"20201127宗地A"},
-                         {"label":"不动产单元号","value":"610102123666GA10002W00000000"},{"label":"坐落","value":"610102123666G10003W"},
-                            {"label":"权利人","value":""}]},
-                  {"id":"601130536a6bf6efc7a248af469e982c","dataType":"sql","name":"20201127宗地A222221",
-                      "conf":[{"label":"宗地代码","value":null},{"label":"项目名称","value":"20201127宗地A222221"},
-                          {"label":"不动产单元号","value":null},{"label":"坐落","value":null},{"label":"权利人","value":""}]},
-                  {"id":"c0818d9e4286b35b8ee9b96d90b522aa","dataType":"sql","name":"20201127宗地A2222222",
-                      "conf":[{"label":"宗地代码","value":null},{"label":"项目名称","value":"20201127宗地A2222222"},
-                          {"label":"不动产单元号","value":null},{"label":"坐落","value":null},{"label":"权利人","value":""}]},
-
-                  {"id":"601130536a6bf6efc7a248af469e982c1","dataType":"sql","name":"20201127宗地B",
-                      "conf":[{"label":"宗地代码","value":null},{"label":"项目名称","value":"20201127宗地B"},
-                          {"label":"不动产单元号","value":null},{"label":"坐落","value":null},{"label":"权利人","value":""}]},
-                  {"id":"c0818d9e4286b35b8ee9b96d90b522aa1","dataType":"sql","name":"20201127宗地B1",
-                      "conf":[{"label":"宗地代码","value":null},{"label":"项目名称","value":"20201127宗地B1"},
-                          {"label":"不动产单元号","value":null},{"label":"坐落","value":null},{"label":"权利人","value":""}]},
-
-                  {"id":"c0818d9e4286b35b8ee9b96d90b522aa12","dataType":"sql","name":"20201127宗地C",
-                      "conf":[{"label":"宗地代码","value":null},{"label":"项目名称","value":"20201127宗地C"},
-                          {"label":"不动产单元号","value":null},{"label":"坐落","value":null},{"label":"权利人","value":""}]},
-              ],
-
-              "edges":[
-                  {"source":"836524edab33ab19bb0e0b4fd064cd77","target":"601130536a6bf6efc7a248af469e982c"},
-                  {"source":"836524edab33ab19bb0e0b4fd064cd77","target":"c0818d9e4286b35b8ee9b96d90b522aa"},
-                  {"source":"c0818d9e4286b35b8ee9b96d90b522aa","target":"601130536a6bf6efc7a248af469e982c1"},
-                  {"source":"c0818d9e4286b35b8ee9b96d90b522aa","target":"c0818d9e4286b35b8ee9b96d90b522aa1"},
-                  {"source":"601130536a6bf6efc7a248af469e982c1","target":"c0818d9e4286b35b8ee9b96d90b522aa12"},
-                  {"source":"c0818d9e4286b35b8ee9b96d90b522aa1","target":"c0818d9e4286b35b8ee9b96d90b522aa12"},
-                  ]};
           this.initG6();
           this.initG6();
         }
         }
       })
       })
@@ -278,6 +214,15 @@ export default {
     #mountNode{
     #mountNode{
         /*height: calc(100% - 68px);*/
         /*height: calc(100% - 68px);*/
         margin-top: -60px;
         margin-top: -60px;
+        width: 60%;
+        float: left;
+    }
+
+    #mountNodeRight{
+        width: 38%;
+        float: right;
+        height: 1000px;
+        border: 0 solid #5ebbff;
     }
     }
 
 
     .slot{
     .slot{