【Echarts】尖峰图弧线三角形柱形图

echarts 尖峰图三角形弧线
在这里插入图片描述 echarts随意一个示例代码
直接点击上方链接↑↑↑将此段代码↓↓↓放到echarts的示例代码编辑框里：

var xdata = ['返利人员', '下线人员', 123, 123, 123, 123];
var data = [100, 200, 23, 73, 123, 123];
option = {
  grid: {
    left: '2%',
    right: '3%',
    bottom: '2%',
    top: '5%',
    containLabel: true
  },
  xAxis: {
    data: xdata,
    triggerEvent: true,
    axisTick: {
      // 刻度线
      show: false
    },
    axisLine: {
      show: false
    },
    axisLabel: {
      show: true,
      rotate: 0,
      interval: 0,
      textStyle: {
        color: '#9A9A9A',
        fontSize: 15
      }
    }
  },
  yAxis: {
    nameLocation: 'middle',
    nameTextStyle: {
      padding: 30,
      fontSize: 14,
      color: '#fff'
    },
    splitLine: {
      show: true,
      lineStyle: {
        color: '#304849',
        type: 'dashed'
      }
    },
    axisTick: {
      show: false
    },
    axisLine: {
      show: false
    },
    axisLabel: {
      // y轴线
      show: true,
      textStyle: {
        color: '#9A9A9A',
        fontSize: 15
      }
    }
  },
  series: [
    {
      name: 'hill',
      type: 'pictorialBar',
      barCategoryGap:'-80%',/*多个并排柱子设置柱子之间的间距*/
      symbol: 'path://M0,10 L10,10 C5.5,10 5.5,5 5,0 C4.5,5 4.5,10 0,10 z',
      itemStyle: {
        borderColor: "#00FF66",
        borderWidth: 1,
        // 渐变色
        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
          {
            offset: 0,
            color: 'rgba(0, 239, 67, 0.3)'
          },
          {
            offset: 1,
            color: 'rgba(0, 81, 23, 0.3)'
          }
        ])
      },
      label: {
        // 数据上方显示数值
        show: true,
        position: 'top',
        textStyle: {
          color: '#fff',
          fontSize: 15
        }
      },
      data: data
    }
  ]
};