100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > Echarts折线图+柱状图+折线图堆叠展示

Echarts折线图+柱状图+折线图堆叠展示

时间:2018-12-29 14:23:10

相关推荐

Echarts折线图+柱状图+折线图堆叠展示

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%'

}]

};

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。