JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//unpkg.com/vue/dist/vue.js"></script>
<script src="//unpkg.com/echarts/dist/echarts.min.js"></script>
<script src="//unpkg.com/v-charts/lib/index.min.js"></script>

<div id="app">
  <ve-sankey :data="chartData" :settings="chartSettings"></ve-sankey>
</div>

JavaScript

new Vue({
  el: '#app',
  created: function () {
    this.chartData = {
        columns: ['页面', '访问量'],
        rows: [
          { '页面': ' Kylegence Analytics Platform', '访问量': 100000 },
          { '页面': 'Hive', '访问量': 20000 },
          { '页面': 'Table index', '访问量': 80000 },
          { '页面': '内容页a-1', '访问量': 10000 },
          { '页面': '内容页a-2', '访问量': 10000 },
          { '页面': '内容页b-1', '访问量': 60000 },
          { '页面': '内容页b-2', '访问量': 20000 }
        ]
      }
      this.chartSettings = {
        links: [
          { source: 'Kylegence Analytics Platform', target: '列表页a', value: 0.5 },
          { source: 'Kylegence Analytics Platform', target: '列表页b', value: 0.5 },
          { source: 'Hive', target: '内容页a-1', value: 0.1 },
          { source: 'Table index', target: '内容页a-2', value: 0.4 },
          { source: '列表页b', target: '内容页b-1', value: 0.2 },
          { source: '列表页b', target: '内容页b-2', value: 0.3 }
        ]
      }
  }
})