演示基本的组合图,以及数据的四则运算
配置项如下
option = {
title: {
text: '线柱组合图'
},
xAxis: {
data: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat']
},
yAxis: {},
toolbox: {
show : true,
feature : {
dataView : {show: true, readOnly: false},
restore : {show: true},
saveAsImage : {show: true,title:'保存PNG',pixelRatio:3,excludeComponents:['toolbox','dataZoom']},
brush:{show:true,type:['rect']}
}
},
dataZoom: [
{
type: 'inside',
show: true,
xAxisIndex: [0],
start: 1,
end: 35
},
{
type: 'slider',
show: true,
yAxisIndex: [0],
left: '93%',
},
{
type: 'slider',
xAxisIndex: [0],
start: 1,
end: 35
},
{
type: 'inside',
yAxisIndex: [0],
start: 29,
end: 36
}
],
series: [{
type: 'line',
smooth:true,
lineStyle:{
normal:{
color:'#aaa',
width:5
}
},
areaStyle:{
normal:{
color:'#ddd',
}
},
data:[220, 182, 191, 234, 290, 330, 310]
},
//第二图形
{
type: 'bar',
smooth:true,
barWidth:20,
label:{
normal:{
show:true
},
emphasis:{
show:true
}
},
markPoint : {
symbol:'pin',
data : [
{type : 'max', name: '最大值'},
{type : 'min', name: '最小值'}
]
},
itemStyle:{
normal:{
color:'#AAA'
}
},
markLine:{
lineStyle:{
normal:{
color:'#000',
width:1
}
},
data:[{
type:'average', name:'平均值'
}]
},
data:[(220/3).toFixed(1), (182/3).toFixed(1), (191/3).toFixed(1), (234/3).toFixed(1), (290/3).toFixed(1), (330/3).toFixed(1), (310/3).toFixed(1)]
}
],
};