Echarts象形柱圖（山峰圖）簡單應用

• 簡單示例
  
• 程式碼詳述

option = {
        title: {
          text: '年齡段',
          textStyle:{
              fontSize:14,
              color:'#444444',
              fontFamily: "Microsoft Yahei",
              fontWeight:'100'
          },
          x: 'center'
        },
        tooltip: {
            trigger: 'axis'
 
,
            axisPointer: {
                type: 'none'
            },
            formatter: function (params) {
                return params[0].name + ': ' + params[0].value;
            }
        },
        xAxis: {
            data: ['馴鹿', '火箭', '飛機', '高鐵', '輪船', '汽車', '跑步', '步行', ],
            axisTick: {show: false
 
},
            axisLine: {show: false},
            axisLabel: {
                textStyle: {
                    color: '#444444'
                }
            }
        },
        yAxis: {
            splitLine: {show: false},
            axisTick: {show: false},
            axisLine: {show: false
 
},
            axisLabel: {show: false}
        },
        color: ['#89DA4F','#FCC828','#8EC7F4','#CDCBEC','#14B961'],
        series: [{
            name: 'hill',
            type: 'pictorialBar',
            barCategoryGap: '0%',
            // symbol: 'path://M0,10 L10,10 L5,0 L0,10 z',
            symbol: 'path://path://M10 600 Q 95 0 180 600',
            label:{ 
                    normal:{ 
                      show: true, 
                      position: 'top',
                      formatter:'{c}%',
                    } 
                  },
            itemStyle: {
                normal: {
                    opacity: 0.5,
                    color: function (params){
                      var colorList = ['#89DA4F','#FCC828','#8EC7F4','#CDCBEC','#14B961','#E3E3E3'];
                      return colorList[params.dataIndex];
                    }
                },
                emphasis: {
                    opacity: 1
                }
            },
            data: [123, 60, 25, 18, 12, 9, 2, 1],
        }]
    };

注意事項
1. 替換
替換 option.xAxis.data=x;
option.series[0].data=y;（x,y分別是一個數組）
2. 屬性值修改
依據特定的需求，對option物件的屬性做相應的修改