python做实时温度曲线图_基于echarts实时温度折线图表

这里动态数据使用了js模拟生成，使用时修改一下即可。

效果图

a.html代码:

var dom = document.getElementById("container");

var myChart = echarts.init(dom);

var app = {};

option = null;

function randomData() {

now = new Date(+now + oneDay);

value = value + Math.random() * 21 - 10;

return {

name: now.toString(),

value: [

now,

value.toFixed(2)

]

}

}

var data = [];

var now = +new Date();

var oneDay = 5000;

var value = Math.random() * 100;

for (var i = 0; i < 50; i++) {

data.push(randomData());

}

option = {

title: {

text: '实时温度',

x:'center'

},

tooltip: {

trigger: 'axis',

formatter: function (params) {

params = params[0];

var date = new Date(params.name);

return date.toLocaleString('chinese', { hour12: false })+'
温度:'+ params.value[1];

},

axisPointer: {

animation: false

}

},

xAxis: {

type: 'time',

name:'时间',

splitLine: {

show: false

}

},

yAxis: {

type: 'value',

name:'温度℃',

boundaryGap: [0, '100%'],

splitLine: {

show: false

}

},

series: [{

name: '模拟数据',

type: 'line',

data: data

}]

};

setInterval(function () {

data.shift();

data.push(randomData());

myChart.setOption({

series: [{

data: data

}]

});

}, 5000);;

if (option && typeof option === "object") {

myChart.setOption(option, true);

}