自定义echarts绘制直方图，XY轴互调Demo

 1 const colorList = [
 2   '#4f81bd',
 3   '#c0504d',
 4   '#9bbb59',
 5   '#604a7b',
 6   '#948a54',
 7   '#e46c0b'
 8 ];
 9 const data = [
10   [10, 16, 3, 'A'],
11   [16, 18, 15, 'B'],
12   [18, 26, 12, 'C'],
13   [26, 32, 22, 'D'],
14   [32, 56, 7, 'E'],
15   [56, 62, 17, 'F']
16 ].map(function (item, index) {
17   return {
18     value: item,
19     itemStyle: {
20       color: colorList[index]
21     }
22   };
23 });
24 option = {
25   title: {
26     text: 'Profit',
27     left: 'center'
28   },
29   tooltip: {},
30   yAxis: {
31     scale: true
32   },
33   xAxis: {},
34   series: [
35     {
36       type: 'custom',
37       renderItem: function (params, api) {
38         var yValue = api.value(1);
39         var start = api.coord([0, yValue]);
40         var size = api.size([api.value(2), api.value(1)-api.value(0)]);
41         var style = api.style();
42         return {
43           type: 'rect',
44           shape: {
45             x: start[0],
46             y: start[1],
47             width: size[0],
48             height: size[1]
49           },
50           style: style
51         };
52       },
53       label: {
54         show: true,
55         position: 'top'
56       },
57       dimensions: ['from', 'to', 'profit'],
58       encode: {
59         y: [0,1],
60         x: 2,
61         tooltip: [0, 1, 2],
62         itemName: 3
63       },
64       data: data
65     }
66   ]
67 };