echart自定义动画_echarts动画效果

最近工作中碰到一个需求，要求动态展示柱状图，大概效果如下：

图片是我用操作宽度模拟的效果，但是echarts以前没接触过，今天看了下文档，梯形也没做出来，想请教下大家echarts能否完成图中效果？如何实现？

看来图片是误导大家了，当时为了上传方便，只截了一部分。实际需求是展示一个柱状图，数据是静态的，不需要从后台获取。是要在柱图中实现类似图中的效果。进度条的话，应该是非常常见的需求，实现的方法也比较多，纯css设置transition，js控制宽度什么的，都比较容易想到，不过用echarts的话，大家有什么思路么？

我自己试了下，效果不太好，也没查到类似的demo，所以想请教下各位大神。

这是我的一开始的思路，效果很不好，希望各位大神不吝赐教：

var data = [],option = {};// 实际的数据和echarts的配置，不放了，可以随便设

function setData(i, num, count){

var timer;

timer = setInterval(function(){

myChart.setOption(option);

if(data[i] < num){

data[i] += count;

}else{

clearInterval(timer);

}

}, 100);

}

for(var i=0,n = data.length;i

setData(i, data[i], 10);

}