163Echarts - 桑基图(Basic Sankey)

简介: 163Echarts - 桑基图(Basic Sankey)
效果图

源代码
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>ECharts</title>
    <!-- 引入 echarts.js -->
    <script src="js/echarts.min.js"></script>
    <script src="js/jquery-1.11.0.min.js"></script>
    <script src="dist/extension/dataTool.js"></script>
  </head>
  <body>
    <!-- 为ECharts准备一个具备大小(宽高)的Dom -->
    <div id="main" style="width: 1024px;height:768px;"></div>
    <script type="text/javascript">
      // 基于准备好的dom,初始化echarts实例
      var myChart = echarts.init(document.getElementById('main'));
      var option;
      myChart.showLoading();
      option = {
        series: {
          type: 'sankey',
          layout: 'none',
          focusNodeAdjacency: 'allEdges',
          data: [{
            name: 'a'
          }, {
            name: 'b'
          }, {
            name: 'a1'
          }, {
            name: 'a2'
          }, {
            name: 'b1'
          }, {
            name: 'c'
          }],
          links: [{
            source: 'a',
            target: 'a1',
            value: 5
          }, {
            source: 'a',
            target: 'a2',
            value: 3
          }, {
            source: 'b',
            target: 'b1',
            value: 8
          }, {
            source: 'a',
            target: 'b1',
            value: 3
          }, {
            source: 'b1',
            target: 'a1',
            value: 1
          }, {
            source: 'b1',
            target: 'c',
            value: 2
          }]
        }
      };
      myChart.setOption(option);
    </script>
  </body>
</html>
目录
相关文章
162Echarts - 桑基图(Sankey Diagram)
162Echarts - 桑基图(Sankey Diagram)
71 0
160Echarts - 桑基图(Sankey Node Align Left)
160Echarts - 桑基图(Sankey Node Align Left)
117 0
152Echarts - 旭日图(Basic Sunburst)
152Echarts - 旭日图(Basic Sunburst)
66 0
146Echarts - 矩形树图(Basic Treemap)
146Echarts - 矩形树图(Basic Treemap)
201 0
105Echarts - K 线图(Basic Candlestick)
105Echarts - K 线图(Basic Candlestick)
64 0
164Echarts - 桑基图(Sankey Orient Vertical)
164Echarts - 桑基图(Sankey Orient Vertical)
35 0
161Echarts - 桑基图(Sankey Node Align Right)
161Echarts - 桑基图(Sankey Node Align Right)
65 0
159Echarts - 桑基图(Sankey Diagram)
159Echarts - 桑基图(Sankey Diagram)
125 0
157Echarts - 平行坐标系(Basic Parallel)
157Echarts - 平行坐标系(Basic Parallel)
38 0
108Echarts - 雷达图(Basic Radar Chart)
108Echarts - 雷达图(Basic Radar Chart)
44 0

热门文章

最新文章