圆锥echarts pictorialBar配置项内容和展示

      option = {
   grid: {
        left: '3%',
        right: '3%',
        bottom: '40%',
        top: '40%',
        containLabel: true
    },
    backgroundColor: '#040821',
    tooltip: {
        trigger: 'item',
    },
    xAxis: {
        data: ["美国·纽约", "日本·东京", "英国·伦敦", "泰国·曼谷", "韩国·首尔"],
        axisTick: {
            show: false
        },
        axisLine: {
            show: false
        },
        axisLabel: {
            textStyle: {
                color: '#888',
                margin: 17,
                fontSize: 36

            },
            margin: 20, //刻度标签与轴线之间的距离。
        },
        splitArea: {
            show: true,
            areaStyle: {
                color: ["rgba(250,250,250,0.05)", "rgba(250,250,250,0.0)"],
                width: 100,
            }
        }

    },
    yAxis: {
        splitLine: {
            show: false,

        },
        axisTick: {
            show: false
        },
        axisLine: {
            show: false
        },
        axisLabel: {
            show: false
        },
       
    },
    series: [{
        name: '',
        type: 'pictorialBar',
        symbolSize: [100, 20],
        symbolOffset: [0, -10],
        z: 12,
        symbolPosition: 'end',

        itemStyle: {
            normal: {
                color: function(params) {

                    var colorList = [
                        '#60a39b', '#406ca7', '#60a39b', '#406ca7', '#60a39b',
                    ];

                    return colorList[params.dataIndex]

                },
            }
        },
        data: [31007, 23321, 11654, 9680, 8123]


    }, {
        name: '',
        type: 'pictorialBar',
        symbolSize: [100, 25],
        symbolOffset: [0, 10],
        z: 12,
        label: {
            show: true,
            position: 'top',
            color: '#fff',
            fontSize: 36,
            formatter:function(params) {
                return parseFloat(params.value).toLocaleString();
                console.log(params.value);
                
            }
        },
        itemStyle: {
            normal: {
                color: function(params) {

                    // build a color map as your need.

                    var colorList = [

                        '#198875', '#014ba6', '#198875', '#014ba6', '#198875',



                    ];

                    return colorList[params.dataIndex]

                },
            }
        },
        data: [31007, 23321, 11654, 9680, 8123]
    }, {
        type: 'bar',
        itemStyle: {
            normal: {
                color: function(params) {

                    // build a color map as your need.

                    var colorList = [

                        '#198875', '#014ba6', '#198875', '#014ba6', '#198875',

                    ];

                    return colorList[params.dataIndex]

                },
            }
        },
        barWidth: 100,
        data: [31007, 23321, 11654, 9680, 8123]
    }]
};