echarts series里面无法获取数据怎么办?后端用的flask传送一个二维元组,四条曲线想分别取每一个小元组的值x轴用的是实时时间。
<div id="suspension" style="width:300px; height:300px;">
{% for new_result in result%}
<script src="js/echarts.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
var myChart = echarts.init(document.getElementById('suspension'));
var option;
function randomData() {
var now = new Date();
value = value + Math.random() * 21 - 10;
return {
value: [
[now.getHours(), now.getMinutes(), now.getSeconds()].join(':'),
Math.round(value)
]
}
}
var data = [];
var date = [];
var value = Math.random() * 1000;
for (var i = 0; i < 1000; i++) {
data.push(randomData());
date.push('')
}
option = {
title: {
text: '线位移',
textStyle:{
fontSize: '20px'
}
},
tooltip: {
trigger: 'axis',
formatter: function (params) {
params = params[0];
return params.value[0] + ' / ' + params.value[1];
},
axisPointer: {
animation: false,
type: 'cross',
label: {
backgroundColor: ''
}
}
},
grid: {
top:'20%',
left: '3%',
right: '4%',
bottom: '2%',
containLabel: true
},
legend: { //可以选择显示数据
// data:['左前','右前','左后','右后'],
data:[
{
name: '左前',
},
{
name: '右前',
},
{
name: '左后',
},
{
name: '右后',
}],
top:'7%',
textStyle:
{
fontSize: '15px',
color:'black',
}
},
toolbox: {
show: true,
feature: {
dataView: {readOnly: false},
restore: {},
saveAsImage: {}
}
},
dataZoom: {
show: false,
start: 0,
end: 100
},
xAxis: {
type: 'category',
splitLine: {
show: false
},
interval:10,
boundaryGap: false,
scale:true,
axisLabel:{
interval:1,
rotate:45,
},
data: date
},
yAxis: [{
type: 'value',
scale: true,
name: '',
axisLabel: { //单位
formatter: '{value} mm'
},
max: 0.5,
min: -0.5,
splitLine: {
show: false
}
},
{
type: 'value',
scale: true,
name: '',
axisLabel: { //单位
formatter: '{value} mm'
},
max: 0.5,
min: -0.5,
splitLine: {
show: false
}
}
],
series: [{
name: '左前',
type: 'line',
showSymbol: false,
hoverAnimation: false,
data: data
},
{
name: '右前',
type: 'line',
showSymbol: false,
hoverAnimation: false,
data: data
},
{
name: '左后',
type: 'line',
showSymbol: false,
hoverAnimation: false,
data: data
},
{
name: '右后',
type: 'line',
showSymbol: false,
hoverAnimation: false,
data: data
}]
};
setInterval(function () {
var _data = randomData();
data.shift();
date.shift();
data.push(_data);
date.push(_data.value[0])
myChart.setOption({
xAxis: {
data: date
},
series: [{
data: new_result[0]
},{
data: new_result[1]
},{
data: new_result[2]
},{
data: new_result[3]
}]
});
}, 1000);
myChart.setOption(option);
</script>
{% endfor %}
</div>
把循环体放进script标签内,无反应。
把循环体放在外面,会不断创建div模块,series也没有数据。我该怎么样让result的数据显示在series里啊?