洛羿莎麦

导航

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)'
                    }

                }
            }]

 






posted on 2016-03-09 11:07  洛羿莎麦  阅读(353)  评论(0编辑  收藏  举报