[vue]vue+echars 生成一个横向柱状随机跑图

给定一个图表位置

< div id="main" style="width: 500px;height: 300px; box-sizing">< /div>  export default{
name:"index",
data(){
return{
}
}  methods:{  

 
   let chartDom = document.getElementById("main");//获取dom节点    let myChart = echarts.init(chartDom);
   let option;

   let data = [];    for (let i = 0; i < 5; ++i) {
     data.push(Math.round(Math.random() * 0.1));    }

   option = {      xAxis: {
       max: "dataMax",      },
     yAxis: {        type: "category",
       data: ["a", "b", "c", "d", "e"],//y轴名        inverse: true,
       animationDuration: 4,        animationDurationUpdate: 4,
       max: 4,      },
     series: [        {
         realtimeSort: true,          name: "地区税率", //表名
         type: "bar",//柱状          data: data,
         label: {            show: true,
           position: "right",            valueAnimation: true,
         },        },
     ],      legend: {
       show: true,      },
     animationDuration: 3000,      animationDurationUpdate: 3000,
     animationEasing: "linear",      animationEasingUpdate: "linear",
   };//随机递加

   function update() {      var data = option.series[0].data;
     for (var i = 0; i < data.length; ++i) {        if (Math.random() > 0.9) {
         data[i] += Math.round(Math.random() * 1);        } else {
         data[i] += Math.round(Math.random() * 2);        }
     }      myChart.setOption(option);
   }

   setInterval(function () {      update();
   }, 3000);

   option && myChart.setOption(option);


 };