pieChart(e) {
for (var i = 0; i < this.persionList.length; i++) {
console.log('拿到后端的数据'+i,e[i].xdlist[0].zhengfu);
// debugger
let yAxisDatazhengfu = e[i].xdlist[0].zhengfu;
console.log('yAxisDatazhengfu-let',yAxisDatazhengfu);
this.pmyDivbox[i] = "echart" + i;
// console.log('1',this.pmyDivbox[i]);
var totalFlowRate = this.$echarts.init(
document.getElementById(this.pmyDivbox[i])
);
var xAxisData = [];
// 应该是50个0，初始值，和下面的50相对应
var yAxisData = [
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0,
0
];
for (var j = 50; j > 0; j--) {
xAxisData.push(j + "秒前");
}
// console.log("xAxisData数据", xAxisData);
// for (i = 1; i < 50; i++) {
// yAxisData.push(Math.round(Math.random()));
// }
// console.log("yAxisData数据为数组", yAxisData);
var totalFlowRateOption = {
animation: false,
title: {
text: "心电图" /,
left:"110px"/
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "cross"
}
},
grid: {
left: 50 /"50px"/,
right: 15 /"15px"/
},
legend: {
data: ["心电图数据"]
},
z:20,
// 回放
dataZoom: {
show: true,
realtime: true,
// y: 0,
height: 15,
start: 0,
end: 30
},
// 工具栏
toolbox: {
feature: {
restore: {}, //刷新
saveAsImage: {}, //下载
// 自定义组件
myTool1: {
show: true,
title: "暂停",
icon:
"'path://M30.9,53.2C16.8,53.2,5.3,41.7,5.3,27.6S16.8,2,30.9,2C45,2,56.4,13.5,56.4,27.6S45,53.2,30.9,53.2z M30.9,3.5C17.6,3.5,6.8,14.4,6.8,27.6c0,13.3,10.8,24.1,24.101,24.1C44.2,51.7,55,40.9,55,27.6C54.9,14.4,44.1,3.5,30.9,3.5z M36.9,35.8c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H36c0.5,0,0.9,0.4,0.9,1V35.8z M27.8,35.8 c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H27c0.5,0,0.9,0.4,0.9,1L27.8,35.8L27.8,35.8z'",
onclick: function() {
console.log("清除定时器9", yAxisData);
if (refreshInterval) {
clearInterval(refreshInterval);
console.log("清除定时器1", yAxisData);
}
// clearInterval(refreshInterval);
// if(this.refreshInterval2){
clearInterval(this.refreshInterval2);
console.log("清除定时器2", yAxisData);
// }
}
},
myTool2: {
show: true,
title: "开始",
icon:
"'path://M30.9,53.2C16.8,53.2,5.3,41.7,5.3,27.6S16.8,2,30.9,2C45,2,56.4,13.5,56.4,27.6S45,53.2,30.9,53.2z M30.9,3.5C17.6,3.5,6.8,14.4,6.8,27.6c0,13.3,10.8,24.1,24.101,24.1C44.2,51.7,55,40.9,55,27.6C54.9,14.4,44.1,3.5,30.9,3.5z M36.9,35.8c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H36c0.5,0,0.9,0.4,0.9,1V35.8z M27.8,35.8 c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H27c0.5,0,0.9,0.4,0.9,1L27.8,35.8L27.8,35.8z'",
onclick: function() {
console.log("开始定时器1", yAxisData);
refreshInterval = setInterval(function() {
for (var i = 0; i < 1; i++) {
// console.log("开始定时器2",yAxisData);
yAxisData.shift();
yAxisData.push(Math.floor(Math.random() * 41) + 60);
}
totalFlowRate.setOption({
series: [
{
data: yAxisData
}
]
});
}, 1000);
}
},
myTool3: {
show: true,
title: "加速2s",
icon:
"'path://M30.9,53.2C16.8,53.2,5.3,41.7,5.3,27.6S16.8,2,30.9,2C45,2,56.4,13.5,56.4,27.6S45,53.2,30.9,53.2z M30.9,3.5C17.6,3.5,6.8,14.4,6.8,27.6c0,13.3,10.8,24.1,24.101,24.1C44.2,51.7,55,40.9,55,27.6C54.9,14.4,44.1,3.5,30.9,3.5z M36.9,35.8c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H36c0.5,0,0.9,0.4,0.9,1V35.8z M27.8,35.8 c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H27c0.5,0,0.9,0.4,0.9,1L27.8,35.8L27.8,35.8z'",
onclick: function() {
console.log("加速2s", yAxisData);
this.refreshInterval2 = setInterval(function() {
for (var i = 0; i < 1; i++) {
// console.log("开始定时器2",yAxisData);
yAxisData.shift();
yAxisData.push(Math.floor(Math.random() * 41) + 60);
// console.log("加速2s数据", yAxisData);
}
totalFlowRate.setOption({
series: [
{
data: yAxisData
}
]
});
}, 2000);
}
},
myTool4: {
show: true,
title: "增益控制",
icon:
"'path://M30.9,53.2C16.8,53.2,5.3,41.7,5.3,27.6S16.8,2,30.9,2C45,2,56.4,13.5,56.4,27.6S45,53.2,30.9,53.2z M30.9,3.5C17.6,3.5,6.8,14.4,6.8,27.6c0,13.3,10.8,24.1,24.101,24.1C44.2,51.7,55,40.9,55,27.6C54.9,14.4,44.1,3.5,30.9,3.5z M36.9,35.8c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H36c0.5,0,0.9,0.4,0.9,1V35.8z M27.8,35.8 c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H27c0.5,0,0.9,0.4,0.9,1L27.8,35.8L27.8,35.8z'",
onclick: function() {
console.log("加速2s", yAxisData);
totalFlowRate.setOption({
yAxis: [
{
min: "60",
max: "100"
}
]
});
}
},
myTool5: {
show: true,
title: "打印图表",
icon:
"'path://M30.9,53.2C16.8,53.2,5.3,41.7,5.3,27.6S16.8,2,30.9,2C45,2,56.4,13.5,56.4,27.6S45,53.2,30.9,53.2z M30.9,3.5C17.6,3.5,6.8,14.4,6.8,27.6c0,13.3,10.8,24.1,24.101,24.1C44.2,51.7,55,40.9,55,27.6C54.9,14.4,44.1,3.5,30.9,3.5z M36.9,35.8c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H36c0.5,0,0.9,0.4,0.9,1V35.8z M27.8,35.8 c0,0.601-0.4,1-0.9,1h-1.3c-0.5,0-0.9-0.399-0.9-1V19.5c0-0.6,0.4-1,0.9-1H27c0.5,0,0.9,0.4,0.9,1L27.8,35.8L27.8,35.8z'",
onclick: function() {
console.log("打印图表", yAxisData);
// totalFlowRate.setOption({
// yAxis: [
// {
// min: "60",
// max: "100"
// }
// ]
// });
}
}
}
},
xAxis: {
boundaryGap: false,
data: xAxisData,
// x轴字体斜着显示
axisLabel: {
interval: 0,
rotate: 10
}
},
yAxis: {
boundaryGap: false
// 增益控制
// min:"60",
// max:"100"
},
series: {
// symbol: "none" /去掉小圆点/,
name: "心电图数据",
type: "line",
itemStyle: {
normal: {
lineStyle: {
width: 2, //折线宽度
color: "#FF0000" //折线颜色
}
}
},
label: {
normal: {
show: true,
position: "top",
color: "red"
}
},
data: yAxisData /,
smooth:true//0-1之间的数字或true或false，显示为平滑的曲线/
}
};
totalFlowRate.setOption(totalFlowRateOption);
var refreshInterval = setInterval(()=> {
// 插入随机数
// this.getData();
yAxisData.push(yAxisDatazhengfu);
// debugger
// yAxisData.push(Math.floor(Math.random() * 41) + 60);
// console.log(Math.floor(Math.random() * 41) + 60);
yAxisData.shift();
totalFlowRate.setOption(totalFlowRateOption);
}, 1000);
}
},