1. 生成当前时间基准线
option = {
title: {
text: '折线图堆叠'
},
tooltip: {
trigger: 'axis'
},
legend: {
data: ['邮件营销']
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
toolbox: {
feature: {
saveAsImage: {}
}
},
xAxis: {
type: 'category',
boundaryGap: false,
data: [
'00:00', '01:00', '02:00', '03:00', '04:00', '05:00', '06:00',
'07:00', '08:00', '09:00', '10:00', '11:00', '12:00', '13:00',
'14:00', '15:00', '16:00', '17:00', '18:00', '19:00', '20:00',
'21:00', '22:00', '23:00'
]
},
yAxis: {
type: 'value',
/*min: 0,
max:260,
splitNumber:10*/
},
series: [
{
name: '邮件营销',
type: 'line',
stack: '总量',
data: [
120, 132, 101, 134, 90, 230, 210,
120, 132, 101, 134, 90, 260, 210,
120, 132, 101, 134, 90, 230, 210,
120, 132, 101
]
},
{
name:'平行于y轴的趋势线',
type:'line',
markLine: {
data: [[
{coord:[new Date().getHours(),0]},
{coord:[new Date().getHours(),300]}
]],
label: {
normal: {
show: true,
position: 'end',
formatter: new Date().getHours()
},
},
}
}
]
};
2. 随鼠标移动生成带箭头基准线
option = {
title: {
text: '堆叠区域图'
},
tooltip: {
trigger: 'axis',
formatter:function(params,ticket,callback){
var str1= params[0].name;
var ymax= myChart.getModel().getComponent('yAxis').axis.scale._extent[1];//获取y轴上侧最大值,此方法获取结果为数组[y轴最小值,y轴最大值]
var str2= params[0].name.split(" ")[0];
option.series=s(str1,ymax,str2);
myChart.setOption(option);
return params[0].name+'<br>'+params[0].seriesName+":"+params[0].value;
}
},
legend: {
data: ['邮件营销']
},
toolbox: {
feature: {
saveAsImage: {}
}
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
xAxis: [
{
type: 'category',
boundaryGap: false,
data: ['周一 00:00', '周二 01:00', '周三 03:00', '周四 04:00', '周五 05:00', '周六 06:00', '周日 07:00'],
axisLabel: {
interval: 0,
formatter:function(value) {
debugger
var str= value.substring(2, value.length);
return str;
}
}
}
],
yAxis: [
{
type: 'value'
}
],
series: [
{
name: '邮件营销',
type: 'line',
stack: '总量',
data: [120, 132, 101, 134, 90, 280, 210]
},
]
};
function s(str1,ymax,str2){
//alert(echarts.version);
var series=[
{
name: '邮件营销',
type: 'line',
stack: '总量',
data: [120, 132, 101, 134, 90, 280, 210]
},
{
name:'平行于y轴的趋势线',
type:'line',
markLine: {
//name:'cda',
data: [[
{coord:[str1,0]},
{coord:[str1,ymax]}
]],
label: {
normal: {
show: true,
position: 'end',
formatter: str2
},
},
}
}
]
return series;
}