From 3c3a94ebfdcc82cfd8395eb81df143444fbfa80e Mon Sep 17 00:00:00 2001
From: guanqb <18720758508@163.com>
Date: Sat, 07 Jan 2023 16:24:32 +0800
Subject: [PATCH] 首页柱状图样式、警力布局调整、活动样式修改
---
src/views/home/components/leftContainer.vue | 57 +++++++++++++++++++++++++++++----------------------------
1 files changed, 29 insertions(+), 28 deletions(-)
diff --git a/src/views/home/components/leftContainer.vue b/src/views/home/components/leftContainer.vue
index 0f4dd44..13b8986 100644
--- a/src/views/home/components/leftContainer.vue
+++ b/src/views/home/components/leftContainer.vue
@@ -341,7 +341,7 @@
initPersonEcharts () {
var chartDom = document.getElementById('PersonEcharts')
homePersonmyChart = this.$echarts.init(chartDom)
- homePersonmyChart.setOption(this.initPersonOptions(['车站所', '沙溪所', '灵溪所', '北门所', '江光所'], [881, 2211, 6414, 4321, 1232], ['#06B5D7', '#44C0C1', '#71C8B1']))
+ homePersonmyChart.setOption(this.initPersonOptions(['车站所', '沙溪所', '灵溪所', '北门所', '江光所', '江光所', '水南所', '秦峰所', '茅家岭所', '西市所', '朝阳所'], [881, 2211, 6414, 4321, 1232, 881, 2211, 6414, 4321, 1232], ['#06B5D7', '#44C0C1', '#71C8B1']))
},
initPersonOptions (xDate, yDate, colors) {
@@ -360,6 +360,7 @@
axisLabel: {
color: "#fff",
interval: 0,
+ rotate: 45,
fontSize: fontSize(14)
},
axisLine: {
@@ -431,8 +432,8 @@
this.initPersonEcharts()
homePersonmyChart.off('click')
this.clickPeopleChart()
- xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所']
- yDate = [881, 2211, 6414, 4321, 1232]
+ xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所', '水南所', '秦峰所', '茅家岭所', '西市所', '朝阳所']
+ yDate = [881, 2211, 6414, 4321, 1232, 881, 2211, 6414, 4321, 1232]
colors = ['#06B5D7', '#44C0C1', '#71C8B1']
homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
} else if (type == 1) {
@@ -443,7 +444,7 @@
inithouseEcharts () {
var chartDom = document.getElementById('houseEcharts')
houseMyChart = this.$echarts.init(chartDom)
- houseMyChart.setOption(this.initHouseOptions(['商业房屋', '居民住宅', '公共用房', '文化场所', '政府建筑'], [88188, 1222211, 464104, 43201, 12302], [{ 'value': 1222211, 'realValue': 88188 }, { 'value': 1222211, 'realValue': 1222211 }, { 'value': 1222211, 'realValue': 464104 }, { 'value': 1222211, 'realValue': 43201 }, { 'value': 1222211, 'realValue': 12302 }]))
+ houseMyChart.setOption(this.initHouseOptions(['公共设施', '餐饮服务', '风景名胜', '公司企业', '购物服务', '商务住宅', '生活服务', '住宿服务', '政府机构及社会团体'], [88188, 1222211, 464104, 43201, 12302, 88188, 1222211, 464104, 43201, 12302], [{ 'value': 1222211, 'realValue': 88188 }, { 'value': 1222211, 'realValue': 1222211 }, { 'value': 1222211, 'realValue': 464104 }, { 'value': 1222211, 'realValue': 43201 }, { 'value': 1222211, 'realValue': 12302 }]))
},
initHouseOptions (xDate, y1Date, y2Date) {
@@ -500,6 +501,7 @@
{
data: y1Date,
type: 'bar',
+ barWidth: '24%',
zlevel: 2,
itemStyle: {
normal: {
@@ -511,19 +513,19 @@
}
},
},
- {
- data: y2Date,
- show: true,
- type: 'bar',
- barGap: '-100%',
- barWidth: '35%', //统计条宽度
- itemStyle: {
- normal: {
- color: 'rgba(102, 102, 102,0.5)'
- },
- },
- z: 1,
- }
+ // {
+ // data: y2Date,
+ // show: true,
+ // type: 'bar',
+ // barGap: '-100%',
+ // barWidth: '35%', //统计条宽度
+ // itemStyle: {
+ // normal: {
+ // color: 'rgba(102, 102, 102,0.5)'
+ // },
+ // },
+ // z: 1,
+ // }
],
grid: {
top: '2%',
@@ -542,12 +544,12 @@
let xDate, y1Date, y2Date
if (type == 0) {
- xDate = ['商业房屋', '居民住宅', '公共用房', '文化场所', '政府建筑']
- y1Date = [88188, 1222211, 464104, 43201, 12302]
+ xDate = ['公共设施', '餐饮服务', '风景名胜', '公司企业', '购物服务', '商务住宅', '生活服务', '住宿服务', '政府机构及社会团体']
+ y1Date = [88188, 1222211, 464104, 43201, 12302, 88188, 1222211, 464104, 43201, 12302]
y2Date = [{ 'value': 1222211, 'realValue': 88188 }, { 'value': 1222211, 'realValue': 1222211 }, { 'value': 1222211, 'realValue': 464104 }, { 'value': 1222211, 'realValue': 43201 }, { 'value': 1222211, 'realValue': 12302 }]
} else {
- xDate = ['公共场所', '学校教培', '机动车维修', '娱乐场所', '寄递业']
- y1Date = [54, 77, 97, 141, 191]
+ xDate = ['道路附属设施', '地名地址信息', '风景名胜', '交通设施服务', '金融保险服务', '科教文化服务', '摩托车服务', '汽车服务', '通行设施']
+ y1Date = [54, 77, 97, 141, 191, 54, 77, 97, 141, 191]
y2Date = [{ 'value': 191, 'realValue': 54 }, { 'value': 191, 'realValue': 77 }, { 'value': 191, 'realValue': 97 }, { 'value': 191, 'realValue': 141 }, { 'value': 191, 'realValue': 191 }]
}
houseMyChart.setOption(this.initHouseOptions(xDate, y1Date, y2Date), true)
@@ -607,7 +609,6 @@
data: yDate,
type: 'bar',
barWidth: '24%',
- barCategoryGap: '10%',
itemStyle: {
normal: {
barBorderRadius: [30, 30, 0, 0],
@@ -652,11 +653,11 @@
let xDate, yDate
if (type == 0) {
- xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所']
- yDate = [6414, 2211, 4321, 1232, 881]
+ xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所', '水南所', '秦峰所', '茅家岭所', '西市所', '朝阳所']
+ yDate = [6414, 2211, 4321, 1232, 881, 6414, 2211, 4321, 1232, 881]
} else if (type == 1) {
- xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所']
- yDate = [881, 2211, 6414, 4321, 1232]
+ xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所', '水南所', '秦峰所', '茅家岭所', '西市所', '朝阳所']
+ yDate = [881, 2211, 6414, 4321, 1232, 6414, 2211, 4321, 1232, 881]
}
landMyChart.setOption(this.initLandOptions(xDate, yDate), true)
@@ -917,8 +918,8 @@
this.dataDeep = 1
let xDate, yDate, colors
if (this.tabType == 0) {
- xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所']
- yDate = [881, 2211, 6414, 4321, 1232]
+ xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所', '水南所', '秦峰所', '茅家岭所', '西市所', '朝阳所']
+ yDate = [881, 2211, 6414, 4321, 1232, 881, 2211, 6414, 4321, 1232]
colors = ['#06B5D7', '#44C0C1', '#71C8B1']
} else if (this.tabType == 1) {
xDate = ['湖北', '上海', '北京', '广东', '浙江']
--
Gitblit v1.9.3