三角形柱图echarts pictorialBar配置项内容和展示

      function formatNum(strNum) {
    if (strNum.length <= 3) {
        return strNum;
    }
    if (!/^(\+|-)?(\d+)(\.\d+)?$/.test(strNum)) {
        return strNum;
    }
    var a = RegExp.$1,
        b = RegExp.$2,
        c = RegExp.$3;
    var re = new RegExp();
    re.compile("(\\d)(\\d{3})(,|$)");
    while (re.test(b)) {
        b = b.replace(re, "$1,$2$3");
    }
    return a + "" + b + "" + c;
}
var data =[{ month: "应付款项", 
             value: "76281.68"},{ 
             month: "应收款项",
             value: "37402.21"}];
var xAxisMonth = [], barData = [];
for (var i = 0; i < data.length; i++) { // 循环遍历data里面的数据用于展示
    xAxisMonth.push(data[i].month);    // 获取x轴的数据写入到xAxisMonth数组中
    barData.push({                          // barData数组用于获取xAxisMonth中的各组数据
        "name": xAxisMonth[i],
        "value": data[i].value
    });
    
}


option = {
    grid: {
        containLabel: true
    },
    tooltip: {
        trigger: 'axis',
        formatter: '{b}: {c0}万元',
        
    },
     legend: {
        left: '25',
        top: 'top',
        textStyle: {
			color: '#4c647c',
			fontStyle: 'normal',
			fontFamily: '微软雅黑',
			fontSize: 12,            
        },
        data: xAxisMonth
    },
    xAxis: [{
            type: 'category',
            show: true,
            axisLabel: {
                textStyle: {
                   color: '#4c647c',
                }
            },
            axisLine:{//坐标轴轴线相关设置
				lineStyle:{
					color:'#4c647c',
					opacity:0.2
				}
			},
        },
        {
            type: 'category',
            position: "bottom",
            data: xAxisMonth,
            boundaryGap: true,
            // offset: 40,
            axisTick: {
                show: false
            },
             axisLine: {
                show: true,
                lineStyle: {
                    color: '#4c647c',
					opacity:0.2
                }
            },
            axisLabel: {
                textStyle: {
                    color: '#4c647c',
                     fontSize:16
                }
            }
        }

    ],
    yAxis: [{
        type: 'value',
         axisLine: {
                show: false,
                lineStyle: {
                    color: '#4c647c',
                }
            },
			axisTick:{
				show: false
			},
			splitLine: {
				show: true,
				lineStyle: {
					color: ['#000'],
					opacity:0.06
				}
			}
    }],
    series: [{
            name: xAxisMonth,
            type: 'pictorialBar',
            xAxisIndex: 1,
            barCategoryGap: '50%',     // 调整宽度
           symbol: 'path://d="M150 50 L130 130 L170 130  Z"', // 画出三角形
            itemStyle: {
                normal: {
                    color: function(params) {
                        let colorList = [
                            '#FAC45C', '#4996E2'
                        ];
                        return colorList[params.dataIndex];
                    },
                    label: {
                        formatter: function(p) {
                            	return formatNum(p.value);
                            },
							show: true, //开启显示
							position: 'top', //在上方显示
							textStyle: { //数值样式
							color: 'black',
							fontSize: 14
						}
                },
                },
                emphasis: {
                    opacity: 1
                }
            },
            data: barData
    }]
};