G6 - 读数据与保存数据

   <!DOCTYPE html>
    <html>
      <head>
        <meta charset="utf-8">
        <title>读数据与保存数据</title>
<script src="https://a.alipayobjects.com/jquery/jquery/1.11.1/jquery.js"></script>
<script src="https://gw.alipayobjects.com/os/antv/assets/g6/1.2.8/g6.min.js"></script>
      </head>
      <body>
          <div id="c1"></div>
 <script type="text/javascript">
var data = {
  source: {
    "nodes": [
      {
        "x": 140,
        "y": 210,
        "id": "node1"
      },
      {
        "x": 270,
        "y": 210,
        "id": "node2"
      }
    ],
    "edges": [
      {
        "source": "node1",
        "id": "edge1",
        "target": "node2"
      }
    ]
  }
};
var net1 = new G6.Net({
  id: 'c1',              // 容器ID
  fitView: 'autoSize'
});
net1.read(data);
net1.render();
$('#c1').append('<div>图一</div>');
var net2 = new G6.Net({
  id: 'c1',              // 容器ID
  height: 100,
  fitView: 'autoSize'
});
$('#c1').append('<div>图二</div>');
// 设置按钮
$('#c1').prepend('<button id="saveAndread">将第一幅图的数据保存并读入第二幅图</button>');

var saveAndread = $('#saveAndread');

saveAndread.on('click', function() {
  var saveData = net1.save();
  net2.read(saveData);
  net2.render();
});

</script>

      </body>
    </html>
          
读数据与保存数据