上一篇介绍了echarts 使用模块化单文件的引入,如果要在一个页面中添加多张图的话,怎么办呢?
这里向大家介绍一种简单的方法:
建立多个div, id= 'main'.
<div class="chart">
<div id="main"><span>1</span></div>
<div id="main"><span>2</span></div>
<div id="main"><span>3</span></div>
<div id="main"><span>4</span></div>
<div id="main"><span>5</span></div>
<div id="main"><span>6</span></div>
</div>
var myChart = [];
var domMain = $("[id = main]");
然后把图表的设置和setoption都放在function里面
这里把option作为一个object,储存了所有表格的配置
最后用一个loop来set好图表
function (ec,defaultTheme){
echarts = ec;
var option = {
0:{
backgroundColor: '#BCEE68',
title : {
text: '性别'
},
tooltip : {
trigger: 'item',
formatter: "{a} <br/>{b} : {c} ({d}%)"
},
legend: {
data:['男','女']
},
toolbox: {
show : true,
feature : {
dataView : {show: true, readOnly: false},
restore : {show: true},
saveAsImage : {show: true}
}
},
calculable : true,
series : [
{
name:'性别',
type:'pie',
radius : '55%',