关系图表Echart的使用

<script type="text/javascript">
                    $.post(
                        "../GetStockList",
                        {
                            id:id
                        },function(data){
                            var x_labels = []
                            var y_values = []
                            var self = []
                            var ep = []
                            var percents = []
                            
                            if(data==null||data.length==0){
                                $(".stocks table tbody").append("<tr><td>暂无数据</td><td>暂无数据</td><td>暂无数据</td><td>暂无数据</td><td>暂无数据</td><td>暂无数据</td></tr>");
                            }else{
                                for(var i=0;i<data.length;i++){
                                    var name = data[i].name;
                                    var type = data[i].type;
                                    var country = data[i].country;
                                    var percent = data[i].percent;
                                    var capi = data[i].rmb;
                                    
                                    $(".stocks table tbody").append("<tr><td>"+(i+1)+"</td>"+
                                            "<td>"+name+"</td>"+
                                            "<td>"+type+"</td>"+
                                            "<td>"+country+"</td>"+
                                            "<td>"+percent+"</td>"+
                                            "<td>"+capi+"</td>"+
                                            "</tr>");
                                    x_labels.push(name)
                                    y_values.push(capi)
                                    if(type=="36"){
                                        self.push(i)
                                    }else{
                                        ep.push(i)
                                    }
                                    percents.push(percent)
                                }
                            }
                            
                            
                            var myChart = echarts.init(document.getElementById('gq-map'));
                            const data_y = y_values
                            const sideData = data_y.map(item => item)
                
                            option = {
                
                                backgroundColor: "#000000",
                                tooltip: {
                                    trigger: 'axis',
                                    formatter: function (params, ticket, callback) {
                                        
                                        var res = "认缴金额" + ' : ' + params[0].data + "元";
                                        var index = params[0].dataIndex
                                        if(index==0){
                                            block = "<div class='point' style='background:rgb(237,107,108)'></div>最大股东";
                                        }else{
                                            if(self.includes(index)){
                                                block = "<div class='point' style='background:rgb(188,159,210)'></div>企业股东"
                                            }
                                            if(ep.includes(index)){
                                                block = "<div class='point' style='background:rgb(130,194,168)'></div>自然人股东"
                                            }
                                        }
                                        var p = "投资比例"+ ' : ' + percents[index] + "%";
                                        return block+"<br>"+res+"<br>"+p;
                                    },
                                    axisPointer: { // 坐标轴指示器，坐标轴触发有效
                                        type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
                                    }
                                },
                                xAxis: {
                                    data: x_labels,
                                    //坐标轴
                                    axisLine: {
                                        lineStyle: {
                                            color: '#3eb2e8'
                                        }
                                    },
                                    //坐标值标注
                                    axisLabel: {
                                        show: true,
                                        textStyle: {
                                            color: '#fff',
                                        },
                                        interval:-10,  
                                        rotate:-10
                                    }
                                },
                                yAxis: {
                                    //坐标轴
                                    axisLine: {
                                        show: false
                                    },
                                    //坐标值标注
                                    axisLabel: {
                                        show: true,
                                        textStyle: {
                                            color: '#fff',
                                        }
                                    },
                                    //分格线
                                    splitLine: {
                                        lineStyle: {
                                            color: '#4784e8'
                                        }
                                    }
                                },
                                series: [{
                                    name: 'a',
                                    tooltip: {
                                        show: false
                                    },
                                    type: 'bar',
                                    barWidth: 24.5,
                                    itemStyle: {
                                        normal: {
                                            color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                                offset: 0,
                                                color: "#0B4EC3" // 0% 处的颜色
                                            }, {
                                                offset: 0.6,
                                                color: "#138CEB" // 60% 处的颜色
                                            }, {
                                                offset: 1,
                                                color: "#17AAFE" // 100% 处的颜色
                                            }], false)
                                        }
                                    },
                                    data: data_y,
                                    barGap: 0
                                }, {
                                    type: 'bar',
                                    barWidth: 8,
                                    itemStyle: {
                                        normal: {
                                            color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                                                offset: 0,
                                                color: "#09337C" // 0% 处的颜色
                                            }, {
                                                offset: 0.6,
                                                color: "#0761C0" // 60% 处的颜色
                                            }, {
                                                offset: 1,
                                                color: "#0575DE" // 100% 处的颜色
                                            }], false)
                                        }
                                    },
                                    barGap: 0,
                                    data: sideData
                                }, {
                                    name: 'b',
                                    tooltip: {
                                        show: false
                                    },
                                    type: 'pictorialBar',
                                    itemStyle: {
                                        borderWidth: 1,
                                        borderColor: '#0571D5',
                                        color: '#1779E0'
                                    },
                                    symbol: 'path://M 0,0 l 120,0 l -30,60 l -120,0 z',
                                    symbolSize: ['30', '12'],
                                    symbolOffset: ['0', '-11'],
                                    //symbolRotate: -5,
                                    symbolPosition: 'end',
                                    data: data_y,
                                    z: 3
                                }]
                            };
                            myChart.setOption(option);
                        },
                        "json"
                    );
                </script>