echarts引入及应用

1.在官网上下载echarts并引入项目中

<script src="js/echarts.js"></script>

2.给一个DOM作为图表展示的容器，必须有width和height，且这两项必须写在DOM里。

<div class="container" id="main" style="width: 1000px;height: 1000px">

3.初始化echarts，定义option作为数据的容器，初始化后的myCharts.setOption(option);

var myChart = echarts.init(document.getElementById('main'));//初始化
var option = {

};
myChart.setOption(option);

4.具体参数变量设置可参照api及相关书籍，如《ECharts-HowTo》

5.部分样式修改展示

series: [{
                name: '监控项',
                type: 'bar',
                data: [120, 230, 503,183,435,288],
                barWidth : 30,//设置柱条宽度
                itemStyle:{                            //设置柱条颜色
                    normal:{
                        color:'rgba(251,110,82,1)'
                    }

                }
            }]

 

转载于:https://www.cnblogs.com/luoyishamai/p/5257315.html