timearray=[1672209600, 1672209660]时间戳数列,此处举例数据自行补充
data1= [8957120, 8964520]此处举例数据自行补充
data2= [8957120, 8964520]此处举例数据自行补充
若还需要其他图,则yAxis控制显示两个y轴显示,legend和series对应增加图形数据
option = {
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
label: {
backgroundColor: '#283b56'
}
}
},
legend: {
data:["整机流量", "CPU温度"]
},
toolbox: {
show: true,
feature: {
dataView: {readOnly: false},
restore: {},
saveAsImage: {}
}
},
xAxis: [
{
type: 'category',
boundaryGap: true,
data: timearray,
axisLabel: {
formatter: function (value) {
return new Date(value*1000).format("HH:mm")
}
}
}
],
yAxis : [
{
type: 'value',
scale: true,
name: "",
min: 0,
boundaryGap: [0.2, 0.2],
axisLabel: {
formatter: function (value) {
let showValue1 = ""
showValue1 = unit_converter(value, "B", 2)
return showValue1
}
}
},
{
type: 'value',
scale: true,
name: "",
min: 0,
boundaryGap: [0.2, 0.2],
axisLabel: {
show: unit1==unit2?false:true,
formatter: function (value) {
let showValue2 = ""
showValue2 = unit_converter(value, "B", 2)
return showValue2
}
},
splitLine:{
show:false
}
}
]
series = [{
name:"整机流量",
type:"line",
symbol: "none",
smooth: true,
smoothMonotone:'x',
lineStyle: { width: 0 },
areaStyle: {
opacity: 0.8,
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: 'rgb(128, 255, 165)' },
{ offset: 1, color: 'rgb(1, 191, 236)' }
])
},
yAxisIndex: 0,
data:data1,
barGap:'0%'
},
{
name: "CPU温度",
type:"bar",
symbol: "none",
yAxisIndex: 1,
data:data2,
barGap:'0%'
}]
};