g6js+d3-sankey实现桑基图示例代码-html代码-BFW代码库

g6js+d3-sankey实现桑基图示例代码

代码语言：html

所属分类：图表

代码描述：g6js+d3-sankey实现桑基图示例代码，这里演示的是g6的v3.1.0版本。

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>桑基图</title>
    <style>::-webkit-scrollbar{display:none;}html,body{overflow:hidden;margin:0;}</style>
</head>
<body>
<div id="mountNode"></div>
<script>/*Fixing iframe window.innerHeight 0 issue in Safari*/document.body.clientHeight;</script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/antv.g6-3.1.0.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/d3.5.9.1.js"></script>
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/d3-sankey.min.js"></script>
<script>
  var width = window.innerWidth;
  var height = window.innerHeight;
  var colors = ['#1890FF', '#73C9E6', '#13C2C2', '#6CD9B3', '#2FC25B', '#9DD96C', '#FACC14', '#E6965C', '#F04864', '#D66BCA', '#8543E0', '#8E77ED', '#3436C7', '#737EE6', '#223273', '#7EA2E6'];

  G6.registerEdge('sankey', {
    draw: function draw(cfg, group) {
      var data = cfg.data;
      var shape = group.addShape('path', {
        attrs: {
          stroke: 'rgba(0,0,0,0.1)',
          lineWidth: Math.max(1, data.width),
          path: pathFn(data)
        }
      });
      return shape;
    }
  }, 'line');
  var graph = new G6.Graph({
    container: 'mountNode',
    width:.........完整代码请登录后点击上方下载按钮下载查看