+
+
-
@@ -19,6 +23,7 @@
import {getSalesEnergyTypes} from "@/api/SaleRankMarket";
import {getCheZhuLatestTime} from "@/api/SaleRank"
import createOpt from './opt'
+import createOptLight from './optLight'
export default {
name: 'totalTop20',
data() {
@@ -31,6 +36,7 @@ export default {
},
selTime: ['',''],
opt: {},
+ opt2: {},
}
},
created() {
@@ -61,6 +67,7 @@ export default {
ds.push(value);
});
this.opt = createOpt(dx, ds);
+ this.opt2 = createOptLight(dx, ds);
})
},
}
diff --git a/src/views/SaleRank/MarketSaleChina/mscEnergyType/optLight.js b/src/views/SaleRank/MarketSaleChina/mscEnergyType/optLight.js
new file mode 100644
index 0000000..d47f462
--- /dev/null
+++ b/src/views/SaleRank/MarketSaleChina/mscEnergyType/optLight.js
@@ -0,0 +1,145 @@
+/*
+ * @Author: your name
+ * @Date: 2021-10-09 11:01:19
+ * @LastEditTime: 2021-12-23 16:37:35
+ * @LastEditors: Please set LastEditors
+ * @Description: In User Settings Edit
+ * @FilePath: /data-show/src/views/Index/spreadTheSound/opt.js
+ */
+import * as echarts from "echarts";
+import {doStr} from "@/utils/gol/dataTool"
+let colors = ['#5B8FF9','#7DAAFF','#9AC5FF','#B9E2FF','#3A9EC0','#5BB9DB','#78D4F8','#63AECC','#19A576','#43C090','#43C090','#9DF5CA'
+,'#5B8FF9','#7DAAFF','#9AC5FF','#B9E2FF','#3A9EC0','#5BB9DB','#78D4F8','#63AECC','#19A576','#43C090','#43C090','#9DF5CA']
+function createData(ds = []) {
+ let arr = [];
+ for (let i = 0; i < ds.length; i++) {
+ let arr1 = ds[i];
+ for (let j = 0; j < arr1.length; j++) {
+ let n = arr.findIndex(ele => {
+ return ele.name === arr1[j].Key;
+ })
+ if (n === -1) {
+ let obj =
+ {
+ name: arr1[j].Key,
+ type: 'bar',
+ stack: 'total',
+ barWidth: 48,
+ barGap: "-100%",
+ emphasis: {
+ focus: 'series'
+ },
+ label: {
+ show: true,
+ position: 'inside',
+ color: '#000',
+ fontWeight: 600,
+ formatter: (res) => {
+ return res.data + '%'
+ }
+ },
+ itemStyle: {
+ normal: {
+ //柱体的颜色
+ //右,下,左,上(1,0,0,0)表示从正右开始向左渐变
+ color: function () {
+ return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+ {
+ offset: 0,
+ color: colors[j]
+ },
+ {
+ offset: 1,
+ color: colors[j]
+ }
+ ], false);
+ }
+ }
+
+ },
+ data: [arr1[j].Value]
+ }
+ arr.push(obj)
+ } else {
+ arr[n].data.push(arr1[j].Value)
+ }
+ }
+ }
+ return arr;
+}
+export default function createOptLight(dx = [], ds = []) {
+ const data = createData(ds);
+ return {
+ grid: {
+ left: 10,
+ right: 10,
+ bottom: 10,
+ containLabel: true
+ },
+ tooltip: {
+ trigger: "axis",
+ backgroundColor: "#08182F",
+ color: "#fff",
+ borderColor: "#3373CC",
+ textStyle: {
+ color: "#fff", //设置文字颜色
+ },
+ extraCssText: "box-shadow: 0px 0px 10px 0px #3373CC;"
+ },
+ color: colors,
+ legend: {
+ textStyle: { //图例文字的样式
+ color: '#000',
+ fontSize: 10
+ },
+ y: 10,
+ x: 10,
+ itemWidth: 12,
+ itemHeight: 12,
+ borderRadius: 1, //圆角半径
+ },
+ xAxis: {
+ type: 'category',
+ axisLabel :{
+ interval:0,
+ formatter: (value) => {
+ let res = doStr(value, 8);
+ return res
+ }
+ },
+ axisTick: {
+ show: false,
+ },
+ axisLine: {
+ show: false,
+ lineStyle: {
+ color: "#000",
+ },
+ },
+ data: dx
+ },
+ yAxis: {
+ type: 'value',
+ max: 100,
+ axisLine: {
+ show: false,
+ lineStyle: {
+ color: "#000",
+ },
+ },
+ axisLabel: {
+ formatter: (value) => {
+ return value + '%'
+ }
+ },
+ splitLine: {
+ lineStyle: {
+ type: "dashed", // y轴分割线类型
+ color: "#012b4b",
+ },
+ },
+ },
+ series: data
+ }
+
+}
\ No newline at end of file
diff --git a/src/views/SaleRank/MarketSaleChina/mscTotal/totalPassengerVehicle/index.vue b/src/views/SaleRank/MarketSaleChina/mscTotal/totalPassengerVehicle/index.vue
index c40d8cc..686d70c 100644
--- a/src/views/SaleRank/MarketSaleChina/mscTotal/totalPassengerVehicle/index.vue
+++ b/src/views/SaleRank/MarketSaleChina/mscTotal/totalPassengerVehicle/index.vue
@@ -1,14 +1,19 @@
-
-
-
+
+
+
\ No newline at end of file
diff --git a/src/components/v-tab-group/index.vue b/src/components/v-tab-group/index.vue
index 43fdf75..bd86abd 100644
--- a/src/components/v-tab-group/index.vue
+++ b/src/components/v-tab-group/index.vue
@@ -7,13 +7,7 @@
* @FilePath: /data-show/src/components/v-tab-group/index.vue
-->
-
-
- {{item}}
- {{item}}
-
-
-
+
{{item}}
{{item}}
diff --git a/src/views/SaleRank/MarketSaleChina/mscTotal/totalTop20/index.vue b/src/views/SaleRank/MarketSaleChina/mscTotal/totalTop20/index.vue
index bb1ba74..5fc10d0 100644
--- a/src/views/SaleRank/MarketSaleChina/mscTotal/totalTop20/index.vue
+++ b/src/views/SaleRank/MarketSaleChina/mscTotal/totalTop20/index.vue
@@ -4,7 +4,7 @@
-
+
From 6d41b8421905c9930fe4471fe303d52ce1f7f543 Mon Sep 17 00:00:00 2001
From: zx <604444282@qq.com>
Date: Fri, 12 Aug 2022 17:02:26 +0800
Subject: [PATCH 4/4] zx
---
.../ChineseCarSale/carBrandSale/index.vue | 15 ++-
.../ChineseCarSale/carBrandSale/optLight.js | 111 ++++++++++++++++++
.../ChineseCarSale/carLevelSale/index.vue | 13 +-
.../ChineseCarSale/carLevelSale/optLight.js | 111 ++++++++++++++++++
.../ChineseCarSale/carSeriesSale/index.vue | 13 +-
.../ChineseCarSale/carSeriesSale/optLight.js | 111 ++++++++++++++++++
6 files changed, 367 insertions(+), 7 deletions(-)
create mode 100644 src/views/SaleRank/ChineseCarSale/carBrandSale/optLight.js
create mode 100644 src/views/SaleRank/ChineseCarSale/carLevelSale/optLight.js
create mode 100644 src/views/SaleRank/ChineseCarSale/carSeriesSale/optLight.js
diff --git a/src/views/SaleRank/ChineseCarSale/carBrandSale/index.vue b/src/views/SaleRank/ChineseCarSale/carBrandSale/index.vue
index cb08f69..dbb2f9f 100644
--- a/src/views/SaleRank/ChineseCarSale/carBrandSale/index.vue
+++ b/src/views/SaleRank/ChineseCarSale/carBrandSale/index.vue
@@ -1,9 +1,15 @@
-
+
+ 更多品牌
+
+
更多品牌
-
@@ -12,6 +18,7 @@