You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
716 lines
15 KiB
716 lines
15 KiB
3 years ago
|
<template>
|
||
|
|
<div id="echarts"></div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
echartsFun(val1, val2) {
|
||
|
|
let data1 = [{
|
||
|
|
name: '1#',
|
||
|
|
type: 'bar',
|
||
|
|
// stack: '总量',
|
||
|
|
barMaxWidth: 35,
|
||
|
|
barGap: '10%',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(255, 0, 0, 1.0)',
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val2.firstBuilding,
|
||
|
|
},
|
||
|
|
|
||
|
|
{
|
||
|
|
name: '2#',
|
||
|
|
type: 'bar',
|
||
|
|
// stack: '总量',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(255, 85, 0, 1.0)',
|
||
|
|
barBorderRadius: 0,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val2.secondBuilding,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '3#',
|
||
|
|
type: 'bar',
|
||
|
|
// stack: '总量',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(255, 255, 0, 1.0)',
|
||
|
|
barBorderRadius: 0,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val2.thirdBuilding,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '4#',
|
||
|
|
type: 'bar',
|
||
|
|
// stack: '总量',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(85, 255, 0, 1.0)',
|
||
|
|
barBorderRadius: 0,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val2.forthBuilding,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '5#',
|
||
|
|
type: 'bar',
|
||
|
|
// stack: '总量',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(0,191,183,1)',
|
||
|
|
barBorderRadius: 0,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val2.fivthBuilding,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '6#',
|
||
|
|
type: 'bar',
|
||
|
|
// stack: '总量',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(0, 85, 255, 1.0)',
|
||
|
|
barBorderRadius: 0,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val2.sixthBuilding,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '总数',
|
||
|
|
type: 'line',
|
||
|
|
symbolSize: 5,
|
||
|
|
symbol: 'circle',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(170, 0, 255, 1.0)',
|
||
|
|
barBorderRadius: 0,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val2.sumBuilding,
|
||
|
|
},
|
||
|
|
];
|
||
|
|
let data2 = [{
|
||
|
|
name: '南楼',
|
||
|
|
type: 'bar',
|
||
|
|
// stack: '总量',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(255, 0, 0, 1.0)',
|
||
|
|
barBorderRadius: 0,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val2.sourthBuilding,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '北楼',
|
||
|
|
type: 'bar',
|
||
|
|
// stack: '总量',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(255, 85, 0, 1.0)',
|
||
|
|
barBorderRadius: 0,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val2.northBuilding,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '塔楼',
|
||
|
|
type: 'bar',
|
||
|
|
// stack: '总量',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(85, 255, 0, 1.0)',
|
||
|
|
barBorderRadius: 0,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val2.towerBuilding,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '总数',
|
||
|
|
type: 'line',
|
||
|
|
symbolSize: 5,
|
||
|
|
symbol: 'circle',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(170, 0, 255, 1.0)',
|
||
|
|
barBorderRadius: 0,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val2.sumBuilding,
|
||
|
|
},
|
||
|
|
];
|
||
|
|
// 基于准备好的dom，初始化echarts实例
|
||
|
|
let myChart = this.$echarts.init(document.getElementById('echarts'))
|
||
|
|
// 绘制图表
|
||
|
|
myChart.setOption({
|
||
|
|
tooltip: {
|
||
|
|
trigger: 'axis',
|
||
|
|
axisPointer: {
|
||
|
|
// type: 'shadow',
|
||
|
|
textStyle: {
|
||
|
|
color: '#fff',
|
||
|
|
},
|
||
|
|
},
|
||
|
|
},
|
||
|
|
grid: {
|
||
|
|
borderWidth: 0,
|
||
|
|
top: '18%',
|
||
|
|
bottom: '15%',
|
||
|
|
textStyle: {
|
||
|
|
color: '#fff',
|
||
|
|
},
|
||
|
|
containLabel: true
|
||
|
|
},
|
||
|
|
legend: {
|
||
|
|
x: '30%',
|
||
|
|
top: '0%',
|
||
|
|
textStyle: {
|
||
|
|
color: '#07e6ed',
|
||
|
|
fontSize: 12,
|
||
|
|
},
|
||
|
|
itemWidth: 10,
|
||
|
|
itemHeight: 10,
|
||
|
|
data: val1 == 1 ? ['1#', '2#', '3#', '4#', '5#', '6#', '总数'] : ['南楼', '北楼', '塔楼', '总数'],
|
||
|
|
},
|
||
|
|
|
||
|
|
xAxis: [{
|
||
|
|
type: 'category',
|
||
|
|
axisLine: {
|
||
|
|
lineStyle: {
|
||
|
|
color: 'rgba(255, 255, 255, 0.1)',
|
||
|
|
},
|
||
|
|
},
|
||
|
|
splitLine: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
axisTick: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
splitArea: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
axisLabel: {
|
||
|
|
color: '#fff',
|
||
|
|
fontSize: 12,
|
||
|
|
margin: 5,
|
||
|
|
// interval: 0,
|
||
|
|
},
|
||
|
|
data: val2.time,
|
||
|
|
}, ],
|
||
|
|
yAxis: [{
|
||
|
|
name: '总电量：' + val2.sumBuildingSum + 'kw·h',
|
||
|
|
nameTextStyle: {
|
||
|
|
color: '#1ff9ee',
|
||
|
|
fontSize: 13,
|
||
|
|
padding: [0, 0, 0, 10],
|
||
|
|
},
|
||
|
|
type: 'value',
|
||
|
|
splitLine: {
|
||
|
|
show: true,
|
||
|
|
lineStyle: {
|
||
|
|
color: 'rgba(255, 255, 255, 0.1)',
|
||
|
|
},
|
||
|
|
},
|
||
|
|
axisLine: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
axisTick: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
axisLabel: {
|
||
|
|
color: '#fff',
|
||
|
|
fontSize: 12,
|
||
|
|
},
|
||
|
|
splitArea: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
}, ],
|
||
|
|
// "dataZoom": [{
|
||
|
|
// "show": true,
|
||
|
|
// "height": 12,
|
||
|
|
// "xAxisIndex": [
|
||
|
|
// 0
|
||
|
|
// ],
|
||
|
|
// 'bottom': '5%',
|
||
|
|
// "start": 30,
|
||
|
|
// "end": 70,
|
||
|
|
// handleIcon: 'M512 512m-208 0a6.5 6.5 0 1 0 416 0 6.5 6.5 0 1 0-416 0Z M512 192C335.264 192 192 335.264 192 512c0 176.736 143.264 320 320 320s320-143.264 320-320C832 335.264 688.736 192 512 192zM512 800c-159.072 0-288-128.928-288-288 0-159.072 128.928-288 288-288s288 128.928 288 288C800 671.072 671.072 800 512 800z',
|
||
|
|
// handleSize: '100%',
|
||
|
|
// handleStyle: {
|
||
|
|
// color: "#d3dee5",
|
||
|
|
|
||
|
|
// },
|
||
|
|
// textStyle: {
|
||
|
|
// color: "#fff"
|
||
|
|
// },
|
||
|
|
// borderColor: "#90979c"
|
||
|
|
// }, {
|
||
|
|
// "type": "inside",
|
||
|
|
// "show": true,
|
||
|
|
// "height": 5,
|
||
|
|
// "start": 1,
|
||
|
|
// "end": 35
|
||
|
|
// }],
|
||
|
|
series: val1 == 1 ? data1 : data2,
|
||
|
|
}, true);
|
||
|
|
},
|
||
|
|
echartsFun2(val1, val2) {
|
||
|
|
let datas = [];
|
||
|
|
if (val1 == 1) {
|
||
|
|
datas = [{
|
||
|
|
name: val2[0].name,
|
||
|
|
type: 'line',
|
||
|
|
symbolSize: 5,
|
||
|
|
symbol: 'circle',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: '#fff',
|
||
|
|
borderColor: '#FE4A7A',
|
||
|
|
lineStyle: {
|
||
|
|
color: '#ff0000'
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data: val2[0].yaxis,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: val2[1].name,
|
||
|
|
type: 'line',
|
||
|
|
symbolSize: 5,
|
||
|
|
symbol: 'circle',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: '#fff',
|
||
|
|
borderColor: '#E9AA36',
|
||
|
|
lineStyle: {
|
||
|
|
color: '#ff5500'
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data: val2[1].yaxis,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: val2[2].name,
|
||
|
|
type: 'line',
|
||
|
|
symbolSize: 5,
|
||
|
|
symbol: 'circle',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: '#fff',
|
||
|
|
borderColor: '#0DFFC7',
|
||
|
|
lineStyle: {
|
||
|
|
color: '#ffff00'
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data: val2[2].yaxis,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: val2[3].name,
|
||
|
|
type: 'line',
|
||
|
|
symbolSize: 5,
|
||
|
|
symbol: 'circle',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: '#fff',
|
||
|
|
borderColor: '#0DFFC7',
|
||
|
|
lineStyle: {
|
||
|
|
color: '#00ff00'
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data: val2[3].yaxis,
|
||
|
|
},
|
||
|
|
];
|
||
|
|
} else {
|
||
|
|
datas = [{
|
||
|
|
name: val2[0].name,
|
||
|
|
type: 'line',
|
||
|
|
symbolSize: 5,
|
||
|
|
symbol: 'circle',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: '#fff',
|
||
|
|
borderColor: '#FE4A7A',
|
||
|
|
lineStyle: {
|
||
|
|
color: '#FE4A7A'
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data: val2[0].yaxis,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: val2[1].name,
|
||
|
|
type: 'line',
|
||
|
|
symbolSize: 5,
|
||
|
|
symbol: 'circle',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: '#fff',
|
||
|
|
borderColor: '#E9AA36',
|
||
|
|
lineStyle: {
|
||
|
|
color: '#E9AA36'
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data: val2[1].yaxis,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: val2[2].name,
|
||
|
|
type: 'line',
|
||
|
|
symbolSize: 5,
|
||
|
|
symbol: 'circle',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: '#fff',
|
||
|
|
borderColor: '#0DFFC7',
|
||
|
|
lineStyle: {
|
||
|
|
color: '#0DFFC7'
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data: val2[2].yaxis,
|
||
|
|
},
|
||
|
|
];
|
||
|
|
}
|
||
|
|
// 基于准备好的dom，初始化echarts实例
|
||
|
|
let myChart = this.$echarts.init(document.getElementById('echarts'))
|
||
|
|
// 绘制图表
|
||
|
|
myChart.setOption({
|
||
|
|
tooltip: {
|
||
|
|
trigger: 'axis',
|
||
|
|
axisPointer: {
|
||
|
|
// type: 'shadow',
|
||
|
|
textStyle: {
|
||
|
|
color: '#fff',
|
||
|
|
},
|
||
|
|
},
|
||
|
|
},
|
||
|
|
grid: {
|
||
|
|
borderWidth: 0,
|
||
|
|
top: '18%',
|
||
|
|
bottom: '15%',
|
||
|
|
textStyle: {
|
||
|
|
color: '#fff',
|
||
|
|
},
|
||
|
|
containLabel: true
|
||
|
|
},
|
||
|
|
legend: {
|
||
|
|
x: '25%',
|
||
|
|
top: '0%',
|
||
|
|
textStyle: {
|
||
|
|
color: '#07e6ed',
|
||
|
|
fontSize: 12,
|
||
|
|
},
|
||
|
|
// itemWidth: 10,
|
||
|
|
// itemHeight: 10,
|
||
|
|
data: val1 == 1 ? [val2[0].name, val2[1].name, val2[2].name, val2[3]
|
||
|
|
.name
|
||
|
|
] : [val2[0].name, val2[1].name, val2[2].name],
|
||
|
|
},
|
||
|
|
|
||
|
|
xAxis: [{
|
||
|
|
type: 'category',
|
||
|
|
axisLine: {
|
||
|
|
lineStyle: {
|
||
|
|
color: 'rgba(255, 255, 255, 0.1)',
|
||
|
|
},
|
||
|
|
},
|
||
|
|
splitLine: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
axisTick: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
splitArea: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
axisLabel: {
|
||
|
|
color: '#fff',
|
||
|
|
fontSize: 12,
|
||
|
|
margin: 5,
|
||
|
|
// interval: 0,
|
||
|
|
},
|
||
|
|
data: val2[0].xaxis,
|
||
|
|
}, ],
|
||
|
|
yAxis: [{
|
||
|
|
name: '单位（m³）',
|
||
|
|
nameTextStyle: {
|
||
|
|
color: '#1ff9ee',
|
||
|
|
fontSize: 13,
|
||
|
|
padding: [0, 0, 0, 10],
|
||
|
|
},
|
||
|
|
type: 'value',
|
||
|
|
splitLine: {
|
||
|
|
show: true,
|
||
|
|
lineStyle: {
|
||
|
|
color: 'rgba(255, 255, 255, 0.1)',
|
||
|
|
},
|
||
|
|
},
|
||
|
|
axisLine: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
axisTick: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
axisLabel: {
|
||
|
|
color: '#fff',
|
||
|
|
fontSize: 12,
|
||
|
|
},
|
||
|
|
splitArea: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
}, ],
|
||
|
|
// "dataZoom": [{
|
||
|
|
// "show": true,
|
||
|
|
// "height": 15,
|
||
|
|
// "xAxisIndex": [
|
||
|
|
// 0
|
||
|
|
// ],
|
||
|
|
// 'bottom': '5%',
|
||
|
|
// "start": 30,
|
||
|
|
// "end": 70,
|
||
|
|
// handleIcon: 'path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z',
|
||
|
|
// handleSize: '110%',
|
||
|
|
// handleStyle: {
|
||
|
|
// color: "#d3dee5",
|
||
|
|
|
||
|
|
// },
|
||
|
|
// textStyle: {
|
||
|
|
// color: "#fff"
|
||
|
|
// },
|
||
|
|
// borderColor: "#90979c"
|
||
|
|
// }, {
|
||
|
|
// "type": "inside",
|
||
|
|
// "show": true,
|
||
|
|
// "height": 1,
|
||
|
|
// "start": 1,
|
||
|
|
// "end": 35
|
||
|
|
// }],
|
||
|
|
series: datas,
|
||
|
|
}, true);
|
||
|
|
},
|
||
|
|
echartsFun3(val1) {
|
||
|
|
// 基于准备好的dom，初始化echarts实例
|
||
|
|
console.log(val1)
|
||
|
|
let myChart = this.$echarts.init(document.getElementById('echarts'))
|
||
|
|
// 绘制图表
|
||
|
|
myChart.setOption({
|
||
|
|
tooltip: {
|
||
|
|
trigger: 'axis',
|
||
|
|
axisPointer: {
|
||
|
|
// type: 'shadow',
|
||
|
|
textStyle: {
|
||
|
|
color: '#fff',
|
||
|
|
},
|
||
|
|
},
|
||
|
|
},
|
||
|
|
grid: {
|
||
|
|
borderWidth: 0,
|
||
|
|
top: '18%',
|
||
|
|
bottom: '15%',
|
||
|
|
textStyle: {
|
||
|
|
color: '#fff',
|
||
|
|
},
|
||
|
|
containLabel: true
|
||
|
|
},
|
||
|
|
legend: {
|
||
|
|
x: '30%',
|
||
|
|
top: '0%',
|
||
|
|
textStyle: {
|
||
|
|
color: '#07e6ed',
|
||
|
|
fontSize: 12,
|
||
|
|
},
|
||
|
|
itemWidth: 10,
|
||
|
|
itemHeight: 10,
|
||
|
|
data: ['总量', '1#', '2#', '3#', '4#', '5#', '6#', '制冷机房'],
|
||
|
|
},
|
||
|
|
|
||
|
|
xAxis: [{
|
||
|
|
type: 'category',
|
||
|
|
axisLine: {
|
||
|
|
lineStyle: {
|
||
|
|
color: 'rgba(255, 255, 255, 0.1)',
|
||
|
|
},
|
||
|
|
},
|
||
|
|
splitLine: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
axisTick: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
splitArea: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
axisLabel: {
|
||
|
|
color: '#fff',
|
||
|
|
fontSize: 12,
|
||
|
|
margin: 5,
|
||
|
|
// "interval": 0,
|
||
|
|
},
|
||
|
|
data: val1.time,
|
||
|
|
}, ],
|
||
|
|
yAxis: [{
|
||
|
|
name: '单位（KW h）',
|
||
|
|
nameTextStyle: {
|
||
|
|
color: '#1ff9ee',
|
||
|
|
fontSize: 13,
|
||
|
|
padding: [0, 0, 0, 10],
|
||
|
|
},
|
||
|
|
type: 'value',
|
||
|
|
splitLine: {
|
||
|
|
show: true,
|
||
|
|
lineStyle: {
|
||
|
|
color: 'rgba(255, 255, 255, 0.1)',
|
||
|
|
},
|
||
|
|
},
|
||
|
|
axisLine: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
axisTick: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
axisLabel: {
|
||
|
|
color: '#fff',
|
||
|
|
fontSize: 12,
|
||
|
|
},
|
||
|
|
splitArea: {
|
||
|
|
show: false,
|
||
|
|
},
|
||
|
|
}, ],
|
||
|
|
// "dataZoom": [{
|
||
|
|
// "show": true,
|
||
|
|
// "height": 12,
|
||
|
|
// "xAxisIndex": [
|
||
|
|
// 0
|
||
|
|
// ],
|
||
|
|
// 'bottom': '5%',
|
||
|
|
// "start": 30,
|
||
|
|
// "end": 70,
|
||
|
|
// handleIcon: 'M512 512m-208 0a6.5 6.5 0 1 0 416 0 6.5 6.5 0 1 0-416 0Z M512 192C335.264 192 192 335.264 192 512c0 176.736 143.264 320 320 320s320-143.264 320-320C832 335.264 688.736 192 512 192zM512 800c-159.072 0-288-128.928-288-288 0-159.072 128.928-288 288-288s288 128.928 288 288C800 671.072 671.072 800 512 800z',
|
||
|
|
// handleSize: '100%',
|
||
|
|
// handleStyle: {
|
||
|
|
// color: "#d3dee5",
|
||
|
|
|
||
|
|
// },
|
||
|
|
// textStyle: {
|
||
|
|
// color: "#fff"
|
||
|
|
// },
|
||
|
|
// borderColor: "#90979c"
|
||
|
|
// }, {
|
||
|
|
// "type": "inside",
|
||
|
|
// "show": true,
|
||
|
|
// "height": 5,
|
||
|
|
// "start": 1,
|
||
|
|
// "end": 35
|
||
|
|
// }],
|
||
|
|
series: [{
|
||
|
|
name: '总数',
|
||
|
|
type: 'line',
|
||
|
|
symbolSize: 5,
|
||
|
|
symbol: 'circle',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(170, 0, 255, 1.0)',
|
||
|
|
barBorderRadius: 0,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val1.sumBuilding,
|
||
|
|
}, {
|
||
|
|
name: '1#',
|
||
|
|
type: 'bar',
|
||
|
|
// stack: '总量',
|
||
|
|
barMaxWidth: 35,
|
||
|
|
barGap: '10%',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(255, 0, 0, 1.0)',
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val1.firstBuilding,
|
||
|
|
},
|
||
|
|
|
||
|
|
{
|
||
|
|
name: '2#',
|
||
|
|
type: 'bar',
|
||
|
|
// stack: '总量',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(255, 85, 0, 1.0)',
|
||
|
|
barBorderRadius: 0,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val1.secondBuilding,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '3#',
|
||
|
|
type: 'bar',
|
||
|
|
// stack: '总量',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(255, 255, 0, 1.0)',
|
||
|
|
barBorderRadius: 0,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val1.thirdBuilding,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '4#',
|
||
|
|
type: 'bar',
|
||
|
|
// stack: '总量',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(85, 255, 0, 1.0)',
|
||
|
|
barBorderRadius: 0,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val1.forthBuilding,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '5#',
|
||
|
|
type: 'bar',
|
||
|
|
// stack: '总量',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(0,191,183,1)',
|
||
|
|
barBorderRadius: 0,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val1.fivthBuilding,
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '6#',
|
||
|
|
type: 'bar',
|
||
|
|
// stack: '总量',
|
||
|
|
itemStyle: {
|
||
|
|
normal: {
|
||
|
|
color: 'rgba(0, 85, 255, 1.0)',
|
||
|
|
barBorderRadius: 0,
|
||
|
|
},
|
||
|
|
},
|
||
|
|
data: val1.sixthBuilding,
|
||
|
|
},
|
||
|
|
],
|
||
|
|
}, true);
|
||
|
|
},
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped>
|
||
|
|
#echarts {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
</style>
|