个人阅读记录echarts pictorialBar配置项内容和展示

      
var getData = function() {

    var pics = [];
    for (var i = 0; i < datalist.length; i++) { 
        pics.push({
            value: timecause[i],
            symbol: 'image://' + imgs[i],
            //symbol:  imgs[i],
            symbolSize: ['30', '45'],
            name: booknames[i],
            
        })
    }
    return pics;
};

var pics=getData();

option = {
    title: {
        text: '2017年阅读记录',
        //left: '0%',
        //textAlign: 'center'
    },
    grid: {
        left: 50,
        right: 20,
        bottom: 100,
        top: 30
    },
    tooltip: {
        formatter: function(params) {
            var bookname = '';
            if (params.componentSubType == 'pictorialBar') {
                for (i = 0; i < datalist.length; i++) {
                    if (datalist[i] == params.name) {
                        bookname = booknames[i];
                    }
                }
                return '《' + bookname + '》</br> 阅读时长：' + params.value + '天</br>读完日期：' + params.name;
            }
        }
    },
    xAxis: {

        data: datalist,

    },
    yAxis: {
        splitLine: {
            show: false
        },
        axisLine: {
            show: false
        }
    },
    series: [{
        name: 'hill',
        type: 'pictorialBar',
        barCategoryGap: '-130%',
        //symbol: 'path://M0,10 L10,10 L5,0 L0,10 z',
        symbol: 'path://M0,10 L10,10 C5.5,10 5.5,5 5,0 C4.5,5 4.5,10 0,10 z',
        itemStyle: {
            normal: {
                opacity: 0.5
            },
            emphasis: {
                opacity: 1
            }
        },
        data: timecause,
        z: 0
    }, {
            type: 'pictorialBar',
            symbolPosition: 'end',
            symbolRotate: 30,
            symbolOffset: ['3%', '-100%'],
            data: pics,
            animationDelay: function(idx) {
                return idx * 100 + 500;
            },
           hoverAnimation: true,
            itemStyle: {
                normal: {
                    shadowBlur: 5,
                    shadowColor: '#aaa',
                    shadowOffsetX: 5,
                    shadowOffsetY:5,
                },
                emphasis: {
                    shadowBlur: 10,
                    shadowColor: '#333',
                    shadowOffsetX: 5,
                    shadowOffsetY:5,
                },
            },
            z:10
            
        },
        
    ]
};